Questions tagged «vuejs2»

使用此标记可以解决Vue.js版本2的特定问题，Vue.js是一种用于构建用户界面的开源渐进式Javascript框架。

12
[Vue警告]：属性或方法未在实例上定义，但在渲染期间被引用
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) …
4
Vuejs和Vue.set（），更新数组
我是Vuejs的新手。做了些什么，但我不知道这是简单/正确的方法。 我想要的是 我想要数组中的一些日期，并在事件中更新它们。首先，我尝试了Vue.set，但没有成功。现在，在更改我的数组项之后： this.items[index] = val; this.items.push(); 我没有将push（）推送到数组，而是将其更新。。但是有时最后一项会被隐藏，以某种方式...我认为此解决方案有点不可靠，如何使其稳定？ 简单的代码在这里： new Vue({ el: '#app', data: { f: 'DD-MM-YYYY', items: [ "10-03-2017", "12-03-2017" ] }, methods: { cha: function(index, item, what, count) { console.log(item + " index > " + index); val = moment(this.items[index], this.f).add(count, what).format(this.f); this.items[index] = val; this.items.push(); console.log("arr length: …
12
Vue.js动态图像无法正常工作
我有一种情况，在Vue.js使用webpack网络应用程序时，我需要显示动态图像。我想显示img图像文件名存储在变量中的位置。该变量是一个computed属性，它返回一个Vuex存储变量，该变量在上异步填充beforeMount。 <div class="col-lg-2" v-for="pic in pics"> <img v-bind:src="'../assets/' + pic + '.png'" v-bind:alt="pic"> </div> 但是，当我刚做的时候它完美地工作： <img src="../assets/dog.png" alt="dog"> 我的情况与此小提琴类似，但是在这里它适用于img URL，但是在我的具有实际文件路径的情况下，它不起作用。 正确的方法是什么？
8
如何从Vue.js中的数组中删除项目
我是vue.js（2）的新手，目前正在开发一个简单的事件应用程序。我已经设法添加事件，但是现在我想基于单击按钮来删除事件。 的HTML <div class="list-group"> <div class="list-group-item" v-for="event in events"> <h4 class="list-group-item-heading"> {{ event.name }} </h4> <h5> {{ event.date }} </h5> <p class="list-group-item-text" v-if="event.description">{{ event.description }}</p> <button class="btn btn-xs btn-danger" @click="deleteEvent(event)">Delete</button> </div> </div> </div> JS（Vue） new Vue ({ el: '#app', data: { events: [ { id: 1, name: 'Event 1', description: …
11
VueJs 2.0从大孩子到他的大父母组件发出事件
似乎Vue.js 2.0不会将事件从孙子传递到他的父组件。 Vue.component('parent', { template: '<div>I am the parent - {{ action }} <child @eventtriggered="performAction"></child></div>', data(){ return { action: 'No action' } }, methods: { performAction() { this.action = 'actionDone' } } }) Vue.component('child', { template: '<div>I am the child <grand-child></grand-child></div>' }) Vue.component('grand-child', { template: '<div>I am the grand-child <button …
8
如何在Vue组件中格式化货币？
我的Vue组件是这样的： <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> 的结果{{ item.total }}是 26000000 但是我想格式化它是这样的： 26.000.000,00 在jQuery或JavaScript中，我可以做到 但是，如何在vue组件中做到这一点？
4
。$ mount（）和el [Vue JS]之间的区别
这段代码有什么区别： new Vue({ data () { return { text: 'Hello, World' }; } }).$mount('#app') 和这个： new Vue({ el: '#app', data () { return { text: 'Hello, World' }; } }) 我的意思是使用.$mount()而不是相反有什么好处el？
81 vue.js  vuejs2 
9
NavigationDuplicated不允许导航到当前位置（“ /搜索”）[vuejs]
当我想进行多次搜索时，会显示NavigationDuplicated错误。我的搜索在导航栏中，而我配置搜索的方式是使用模型获取值，然后将该值作为参数传递给ContentSearched组件，然后在该组件中接收搜索的值。 我知道正确的方法是使用发射器，但是我仍然不知道如何学习使用它。要访问发射是context.emit('', someValue) NavigationDuplicated {_name: "NavigationDuplicated", name: "NavigationDuplicated", message: "Navigating to current location ("/search") is not allowed", stack: "Error↵ at new NavigationDuplicated (webpack-int…node_modules/vue/dist/vue.runtime.esm.js:1853:26)"} 导航栏 <template> <nav class="navbar navbar-expand-lg navbar-dark bg-nav" v-bind:class="{'navbarOpen': show }"> <div class="container"> <router-link to="/" class="navbar-brand"> <img src="../assets/logo.png" alt="Horizon Anime" id="logo"> </router-link> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" …
8
将全局变量应用于Vuejs
我有一个javascript变量，我想在实例化时将其全局传递给Vue组件，因此每个注册的组件都将其作为属性，或者可以全局访问。 注意：我需要将vuejs的全局变量设置为READ ONLY属性
3
从Vuex中的一个模块更改另一模块状态
我的vuex商店中有两个模块。 var store = new Vuex.Store({ modules: { loading: loading posts: posts } }); 在模块中loading，我有一个saving可以设置true或的属性，false并且还有一个名为TOGGLE_SAVING该属性的突变函数。 在模块中posts，在获取帖子之前和之后，我想更改property saving。我是通过commit('TOGGLE_SAVING')从posts模块中的操作之一进行调用来实现的。 var getPosts = function (context) { contex.commit(TOGGLE_LOADING); }; 当它尝试提交时，控制台中出现以下错误 [vuex] unknown local mutation type: TOGGLE_LOADING, global type: posts/TOGGLE_LOADING 如何使用来更改另一个模块中的状态commit？
77 vue.js  vuejs2  vuex 
3
v-slot：activator =“ {在}上”的含义
查看Vuetify示例代码v-toolbar的目的是v-slot:activator="{ on }"什么？例如： <template v-slot:activator="{ on }"> <v-toolbar-title v-on="on"> <span>All</span> <v-icon dark>arrow_drop_down</v-icon> </v-toolbar-title> </template> <script> export default { data: () => ({ items: [ 'All', 'Family', 'Friends', 'Coworkers' ] }) } </script> 据我所知，on它在任何地方都不是已定义的变量，因此我看不到它是如何工作的。当我在项目中尝试使用Internet Explorer时，Internet Explorer会引发错误<template v-slot:activator="{ on }">，但如果将其删除，则会呈现页面。
3
控制台警告：使用v-for呈现的组件列表应具有显式键
我在这里遇到问题，我不知道我的代码有什么问题，但是我在控制台中收到警告，如何删除此警告？ [Vue提示]：：<todo-item v-for="todoItem in todos">用v-for呈现的组件列表应具有显式键。有关更多信息，请参见https://vuejs.org/v2/guide/list.html#key。 （位于中<Root>） index.html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Vue Tutorial</title> <link rel="shortcut icon" href="https://vuejs.org/images/logo.png"> <script src="scripts/vue.js"></script> </head> <body> <section id="app"> <p>{{ msg }}</p> <p v-bind:title="message"> Hover your mouse over me for a few seconds to see my dynamically bound title! </p> …
5
Vue.js：条件类样式绑定
Vue.js的Stack Overflow叠图：Сокклассов 我有一些可通过以下方式访问的数据： {{ content['term_goes_here'] }} ...并将其评估为true或false。我想根据表达式的真实性添加一个类，如下所示： <i class="fa" v-bind:class="[{{content['cravings']}} ? 'fa-checkbox-marked' : 'fa-checkbox-blank-outline']"></i> 哪里true给我上课fa-checkbox-marked，错误会给我fa-checkbox-blank-outline。我上面写的方式给我一个错误： - invalid expression: v-bind:class="[{{content['cravings']}} ? 'fa-checkbox-marked' : 'fa-checkbox-blank-outline']" 我应该如何编写它才能有条件地确定班级？
6
如何在Vue单个文件组件中导入和使用图像？
我认为这应该很简单，但是我在如何导入和使用Vue单个文件组件中的图像时遇到了一些麻烦。有人可以帮我怎么做吗？这是我的代码段： <template lang="html"> <img src="zapierLogo" /> </template> <script> import zapierLogo from 'images/zapier_logo.svg' export default { } </script> <style lang="css"> </style> 我尝试使用:src，src="{{ zapierLogo }}"等。但是似乎没有任何作用。我也找不到任何例子。有什么帮助吗？
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.