在VueJs 2.0文档中,我找不到任何可以监听props变化的钩子.
VueJs有类似onPropsUpdated()或类似的钩子吗？
更新
正如@wostex建议的那样,我尝试了watch我的财产但没有改变.然后我意识到我有一个特例:
<template>
<child :my-prop="myProp"></child>
</template>
<script>
export default {
props: ['myProp']
}
</script>
我传递的myProp是父组件接收到child组件.那watch: {myProp: ...}就是不行.
这可以在Vue.Js中传递计算属性中的参数.我可以看到当getter/setter使用computed时,他们可以获取一个参数并将其分配给变量.喜欢这里的文档:
// ...
computed: {
fullName: {
// getter
get: function () {
return this.firstName + ' ' + this.lastName
},
// setter
set: function (newValue) {
var names = newValue.split(' ')
this.firstName = names[0]
this.lastName = names[names.length - 1]
}
}
}
// ...
这也是可能的:
// ...
computed: {
fullName: function (salut) {
return salut + ' ' + this.firstName + ' ' + this.lastName
}
}
// ...
其中computed属性接受一个参数并返回所需的输出.但是,当我尝试这个时,我收到此错误:
vue.common.js:2250未捕获TypeError:fullName不是函数(...)
我应该使用这种方法的方法吗？
我开始https://laracasts.com/series/learning-vue-step-by-step系列.我停止了Vue,Laravel和AJAX这个课程的错误:
Vue.component('task', {
template: '#task-template',
props: ['list'],
created() {
this.list = JSON.parse(this.list);
}
});
new Vue({
el: '.container'
})
我在main.js中有这段代码
Vue.component('task', {
template: '#task-template',
props: ['list'],
created() {
this.list = JSON.parse(this.list);
}
});
new Vue({
el: '.container'
})
我知道当我覆盖列表道具时问题出在created()中,但我是Vue的新手,所以我完全不知道如何解决它.任何人都知道如何(并请解释原因)来修复它？
Vue.js中方法和计算值之间的主要区别是什么？
它们看起来一样,可以互换.
我正在尝试在组件中使用on click指令,但它似乎不起作用.当我点击组件时,当我在控制台中获得"测试点击"时,会发生无关紧要的事情.我没有在控制台中看到任何错误,所以我不知道我做错了什么.
的index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>vuetest</title>
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
App.vue
<template>
<div id="app">
<test v-on:click="testFunction"></test>
</div>
</template>
<script>
import Test from './components/Test'
export default {
name: 'app',
methods: {
testFunction: function (event) {
console.log('test clicked')
}
},
components: {
Test
}
}
</script>
Test.vue(组件)
<template>
<div>
click here
</div>
</template>
<script>
export default {
name: 'test',
data () {
return {
msg: 'Welcome to Your …我使用vuex和vuejs 2在一起.
我是新手vuex,我想看一个store变量.
我想watch在我的功能中添加功能vue component
这是我到目前为止:
import Vue from 'vue';
import {
MY_STATE,
} from './../../mutation-types';
export default {
[MY_STATE](state, token) {
state.my_state = token;
},
};
我想知道是否有任何变化 my_state
我如何store.my_state在我的vuejs组件中观看？
在Vue 2.0中,文档和其他人清楚地表明,从父母到孩子的沟通是通过道具进行的.
父母如何告诉孩子一个事件是通过道具发生的？
我应该只看一个名为事件的道具吗？这感觉不对,也没有替代方案($emit/ $on是孩子到父母,而中心模型是远程元素).
我有一个父容器,它需要告诉它的子容器,可以在API上使用某些操作.我需要能够触发功能.
是否可以在命名空间模块之间调度操作？
例如,我有vuex模块"gameboard"和"notification".每个都是命名空间.我想从游戏板向通知模块发送一个动作.
我以为我可以在调度操作名称中使用模块名称,如下所示:
// store/modules/gameboard.js
const actions = {
myaction ({dispatch}) {
...
dispatch('notification/triggerSelfDismissingNotifcation', {...})
}
}
// store/modules/notification.js
const actions = {
triggerSelfDismissingNotification (context, payload) {
...
}
}
但是当我尝试这样做时,我得到的错误让我觉得vuex试图在我的游戏板模块中发送一个动作:
[vuex] unknown local action type:notification/triggerSelfDismissingNotification,global type:gameboard/notification/triggerSelfDismissingNotification
有没有从vuex模块调度到模块的方法,还是需要在root vuex实例中创建某种桥接？
我在Vue模板中有一个简单的输入框,我想或多或少地使用debounce:
<input type="text" v-model="filterKey" debounce="500">
但是,该debounce物业已在Vue 2中弃用.该建议仅说:"使用v-on:输入+第三方去抖功能".
你是如何正确实现它的？
我试图使用lodash,v-on:input和v-model来实现它,但我想知道是否可以不使用额外的变量.
在模板中:
<input type="text" v-on:input="debounceInput" v-model="searchInput">
在脚本中:
data: function () {
return {
searchInput: '',
filterKey: ''
}
},
methods: {
debounceInput: _.debounce(function () {
this.filterKey = this.searchInput;
}, 500)
}
然后在computed道具中使用filterkey .
开发Vue应用程序后我该怎么办vue-cli？
在Angular中,有一些命令将所有脚本捆绑到一个脚本中,然后将这些文件发送到主机.
Vue中有相同的东西吗？