好家伙,
1.作用域插槽
插槽在定义的时候,可以定义一些属性,便于在父组件中使用
来看看代码:
Article.vue组件中:
App.vue组件中:
App根组件
我是头
{{ obj }}
写博客真是一件开心的事情(NO)
作者:养肥胖虎
截图如下:
msg的值是在子组件中定义的,
父组件中拿到msg的值,
再在子组件中把它渲染出来,
无形中完成了一次子父传值
2.作用域插槽的结构赋值
将Article.vue组件中的代码改为:
export default {
name:'Article',
data(){
return{
//用户信息对象
userinfo:{
name:'zs',
age:20
}
}
}
}
于是在父组件中,可以使用解构方法调用值:
在App.vue组件中:
App根组件
我是头
{{ msg }}
{{ user }}
{{ user.name }}
写博客真是一件开心的事情(NO)
作者:养肥胖虎
搞定后:
That's all
发表评论