创建Vue对象时参数传递的js对象中可以书写哪些属性及函数请书写格式?
创建Vue对象时可以书写以下属性和函数:
- el:表示Vue实例要挂载的HTML元素,可以是CSS选择器字符串或者DOM元素。例如:
el: '#app'或者el: document.getElementById('app')。 - data:表示Vue实例的数据对象,可以包含任何类型的数据,例如字符串、数字、数组、对象等。例如:
data: {message: 'Hello world'}。 - methods:表示Vue实例中的方法,可以包含任何类型的函数,例如普通函数、箭头函数、ES6方法等。例如:
methods: {greet: function() {...}}或者methods: {greet: () => {...}}。 - computed:表示Vue实例中的计算属性,可以根据已有的数据计算出新的数据。例如:
computed: {fullName: function() {...}}。 - watch:表示Vue实例中的观察器,可以监听数据的变化并执行相应的操作。例如:
watch: {message: function() {...}}。 - props:表示Vue组件的属性,可以接收父组件传递的数据。例如:
props: ['title', 'content']。 - components:表示Vue实例中的子组件,可以引用其他组件并在当前组件中使用。例如:
components: {MyComponent: {...}}。
以上属性和函数可以写在一个JavaScript对象中,例如:
new Vue({
el: '#app',
data: {
message: 'Hello world'
},
methods: {
greet: function() {
console.log(this.message)
}
},
computed: {
fullName: function() {
return this.firstName + ' ' + this.lastName
}
},
watch: {
message: function(newVal, oldVal) {
console.log('message changed from ' + oldVal + ' to ' + newVal)
}
},
props: ['title', 'content'],
components: {
MyComponent: {...}
}
})
``
原文地址: https://www.cveoy.top/t/topic/eqxP 著作权归作者所有。请勿转载和采集!