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

<!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>

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.

1 Respuesta

2votos

Leonardo-Tadei Puntos227010

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

0voto

Alejandro6543 comentado

Muchas gracias

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

Otras Preguntas y Respuestas


...

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

Conecta