Preguntas etiquetadas con vue-component

Estoy tratando de entender cómo observar adecuadamente alguna variación de utilería. Tengo un componente primario (archivos .vue) que recibe datos de una llamada ajax, coloca los datos dentro de un objeto y lo usa para representar algún componente secundario a través de una directiva v-for, debajo de una simplificación de …

414 javascript  vue.js  vue-component  vue-resource 

En los documentos de VueJs 2.0 no puedo encontrar ningún gancho que escuche los propscambios. ¿VueJs tiene ganchos similares onPropsUpdated()o similares? Actualizar Como sugirió @wostex, intenté con watchmi propiedad pero nada cambió. Entonces me di cuenta de que tengo un caso especial: <template> <child :my-prop="myProp"></child> </template> <script> export default { …

257 javascript  vue.js  vuejs2  vue-component 

Estoy tratando de usar la directiva de clic dentro de un componente, pero no parece funcionar. Cuando hago clic en el componente, no ocurre nada cuando debo hacer un 'clic de prueba' en la consola. No veo ningún error en la consola, así que no sé qué estoy haciendo mal. …

188 javascript  vue-component  vuejs2  vue.js 

Estoy empezando a jugar con vuejs (2.0). Construí una página simple con un componente en ella. La página tiene una instancia de Vue con datos. En esa página me registré y agregué el componente a html. El componente tiene uno input[type=text]. Quiero que ese valor se refleje en el padre …

155 javascript  vue.js  vue-component 

Tengo que usar dos scripts externos para las pasarelas de pago. En este momento, ambos están en el index.htmlarchivo. Sin embargo, no quiero cargar estos archivos al principio. La pasarela de pago solo se necesita cuando el usuario abre un componente específico ( using router-view). ¿Hay alguna forma de lograr …

151 javascript  vue.js  vuejs2  vue-component  vue-router 

1. ¿Cómo puedo establecer el valor predeterminado para un accesorio de componente en Vue 2? Por ejemplo, hay un moviescomponente simple que se puede usar de esta manera: <movies year="2016"><movies> Vue.component('movies', { props: ['year'], template: '#movies-template', ... } Pero, si un usuario no especifica el year: <movies></movies> entonces el componente …

139 javascript  vue.js  vue-component 

Acabo de instalar Vue y he estado siguiendo algunos tutoriales para crear un proyecto usando la plantilla de paquete web vue-cli. Cuando crea el componente, noto que une nuestros datos dentro de lo siguiente: export default { name: 'app', data: [] } Mientras que en otros tutoriales veo datos vinculados …

136 vue.js  vue-component  vue-cli 

Visión general En Vue.js 2.x, model.syncquedará obsoleto . Entonces, ¿cuál es una forma adecuada de comunicarse entre componentes hermanos en Vue.js 2.x ? Antecedentes Según tengo entendido Vue 2.x, el método preferido para la comunicación entre hermanos es usar una tienda o un bus de eventos . Según Evan (creador …

112 javascript  vue.js  vuejs2  vue-component  vuex 

Tengo un componente con alguna validación de formulario. Es un formulario de pago de varios pasos. El siguiente código es para el primer paso. Me gustaría validar que el usuario ingresó un texto, almacenar su nombre en el estado global y luego enviarlo al siguiente paso. Estoy usando vee-validate y …

108 vue.js  vuejs2  vue-component  vuex 

Tengo una vista dinámica: <div id="myview"> <div :is="currentComponent"></div> </div> con una instancia de Vue asociada: new Vue ({ data: function () { return { currentComponent: 'myComponent', } }, }).$mount('#myview'); Esto me permite cambiar mi componente de forma dinámica. En mi caso, tengo tres componentes diferentes: myComponent, myComponent1, y myComponent2. Y …

105 javascript  vue.js  vuejs2  vue-component 

Mi componente de vue es así: <template> <div> <div class="panel-group" v-for="item in list"> ... <div class="panel-body"> <a role="button" data-toggle="collapse" href="#purchase-{{ item.id }}" class="pull-right" aria-expanded="false" aria-controls="collapseOne"> Show </a> </div> <div id="purchase-{{ item.id }}" class="table-responsive panel-collapse collapse" role="tabpanel"> ... </div> </div> </div> </template> <script> export default { ... computed: { list: function() …

100 vue.js  vuejs2  vue-component 

var MainTable = Vue.extend({ template: "<ul>" + "<li v-for='(set,index) in settings'>" + "{{index}}) " + "{{set.title}}" + "<button @click='changeSetting(index)'> Info </button>" + "</li>" + "</ul>", data: function() { return data; } }); Vue.component("main-table", MainTable); data.settingsSelected = {}; var app = new Vue({ el: "#settings", data: data, methods: { changeSetting: function(index) …

95 javascript  vue.js  vuejs2  vue-component 

Mi componente de Vue es así: <template> <div> <div class="panel-group"v-for="item in list"> <div class="col-md-8"> <small> Total: <b>{{ item.total }}</b> </small> </div> </div> </div> </template> <script> export default { ... computed: { list: function() { return this.$store.state.transaction.list }, ... } } </script> El resultado de {{ item.total }}es 26000000 Pero quiero …

81 vue.js  vuejs2  vue-component  vuex