<script>
import RenameComponent1 from "../RenameComponent1.vue";
import RenameComponent2 from "../RenameComponent2.vue";
export default {
data() {
// data 是往自己组件内部,挂载一些私有数据
return {
name: "张三",
age: 18
};
},
// 父组件向子组件传递的数据写在这里
props: ["max"],
watch: {
// max的值变化时会立即执行函数
max: function(newVal, oldVal) {
}
},
computed: {
//计算属性是基于它们的响应式依赖进行缓存的。只在相关响应式依赖发生改变时它们才会重新求值
//计算属性会将结果缓存起来,这样做的好处就是,如果有一些业务的性能开销比较大,写在这里的话,
//其他不同地方在使用的时候不会进行又一次的代码执行,而是直接拿到最终结果,提高效率,如果结果
//不需要进行缓存的话,可以使用方法进行代替。和侦听属性不一样的是,计算属性时所依赖的值变化才会
//执行函数,比如下面的代码,当firstName或lastName变化的时候才会触发
fullName: function () {
return this.firstName + ' ' + this.lastName
}
}
// 生命周期钩子
created() {},
mounted() {
// 当组件中的DOM结构被渲染好并放到页面中后,会执行这个钩子函数
// 如果要操作元素了,最好在 mounted 里面,因为,这里时候的 DOM 元素 是最新的
},
methods: {
//这个组件所有的方法写在这里
getName(){ return this.name;}
},
components: {
//要使用其他组件,把导入的组件的名称写在这里
RenameComponent1,
RenameComponent2
},
}
</script>
初学vue知识点总结
猜你喜欢
转载自blog.csdn.net/moqiuqin/article/details/94972713
今日推荐
周排行