Hacer Pregunta

Conecta

entre Desarrolladores

Recibe ayuda de expertos

Registrate y pregunta

Es gratis y fácil

Recibe respuestas

Respuestas, votos y comentarios

Vota y selecciona respuestas

Recibe puntos, vota y da la solución

Pregunta

1voto

No me da la ventana modal y no se el porque

preguntó
Web
1237 Vistas
1 Respuestas
abierta
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>CRUD View.JS</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.21/vue.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.18.0/axios.min.js"></script>
    <link rel="stylesheet" type="text/css" href="css/estilos.css">
</head>
<body>
    <!--diseñando el fondo y la ventana modal-->
    <div id="app">
     <button @click="nuevoProducto=true">Nuevo</button>
     <table>
                <thead>
                    <th>Name</th><th>Price</th><th>Quantity</th><th>Event</th>
                </thead>
                <tbody>
                    <tr>
                        <td>1</td>
                        <td>2</td>
                        <td>3</td>
                        <td>
                            <button @click="editarProducto=true">EDIT</button>
                            <button @click="borrarProducto=true">DELET</button>

                        </td>
                    </tr>
                </tbody>
            </table>

        <div class="contenedor" v-if="nuevoProducto">
            <div class="modal">
                <div class="header">
                    <button class="close" @click="nuevoProducto=false">X</button>
                    <h1>Nuevo</h1>
                </div>
                <div class="contenido">
                    Contenidos
                </div>
            </div>
        </div>
        <!-- EDITAR PRODUCTOS -->
    <div class="contenedor" v-if="nuevoProducto">
            <div class="modal">
                <div class="header">
                    <button class="close" @click="nuevoProducto=false">X</button>
                    <h1>Edicion</h1>
                </div>
                <div class="contenido">
                    Contenidos
                </div>
            </div>
        </div>

    <script type="text/javascript">
        // Guarda la informacion de app
        var app = new Vue({
            el:"#app",
            data:{
                nuevoProducto=false,
                editarProducto=false,
                borrarProducto=false
            }
        })
    </script>
</body>
</html>
por Alejandro6543 (300 puntos) en Web
editado por

0voto

Peter comentado

Sería bueno que describas el problema que tienes, como te sucede, cuando te sucede, etc... Tanto en esta, como en tus otras preguntas.

Saludos.

por Peter (150.400 puntos)

1 Respuesta

2votos

Leonardo-Tadei Puntos227300

Hola @Alejandro6543,

adivinando cuál es tu pregunta, el mensajes de error de JavaScript se debe al incorrecto uso del operador de asignación al definir una propiedad:

// Incorrecto
...
data:{
  nuevoProducto=false,
  editarProducto=false,
  borrarProducto=false
}
...

// Correcto
...
data:{
  nuevoProducto:false,
  editarProducto:false,
  borrarProducto:false
}
...

Saludos cordiales

por Leonardo-Tadei (227.300 puntos)

0voto

Alejandro6543 comentado

Muchas gracias

por Alejandro6543 (300 puntos)

Por favor, accede o regístrate para responder a esta pregunta.

Otras Preguntas y Respuestas


Preguntas sin respuesta

Preguntas relacionadas

Actividad Reciente

Ultimas Preguntas

Preguntas relacionadas

Usuarios Top

Todos los Usuarios Usuarios Nuevos

Etiquetas

Categorías

...

Bienvenido a entre Desarrolladores, donde puedes realizar preguntas y recibir respuestas de otros miembros de la comunidad.

Etiquetas

Categorías

Conecta