Vue组件全局注册实现警告框的实例详解
发布时间：2020-12-17 03:11:56 所属栏目：百科 来源：网络整理
导读：外部引入 HTML部分 script部分 效果 全局组件 组件的创建和注册分成3步：创建组件构造器，注册组件，挂载作用域内实例化 例如： 我们来理解组件的创建和注册： Vue.extend()是Vue构造器的扩展，调用Vue.extend()创建的是一个组件构造器，而不是一个具体的组
外部引入HTML部分script部分
{{data}}
`,//注意：data必须是一个函数
data(){
return {
isShow:true
}
},props:['data'],methods:{
close(){
//子组件向父组件发射事件
this.$emit('close');
//关闭消息框
this.isShow = false;
}
},});
new Vue({
el:'.container',data:{
msg:'添加失败！'
},methods:{
closeHandler(){
console.log('关闭了');
}
}
});
效果 全局组件组件的创建和注册分成3步：创建组件构造器，注册组件，挂载作用域内实例化 例如： 我们来理解组件的创建和注册：
全局组件必须写在Vue实例创建之前，才在该根元素下面生效 例如： Prop传值组件实例的作用域是孤立的，父组件可以通过props向下传递数据给子组件。 Prop静态传递数据{{msg}} {{data}} ` })Prop动态传递数据{{msg}} ` }) new Vue({ el:'.father,data:{ val:'添加失败！' } })总结以上所述是小编给大家介绍的Vue组件全局注册实现警告框的实例详解。编程之家 52php.cn 收集整理的教程希望能对你有所帮助，如果觉得编程之家不错，可分享给好友！感谢支持。 （编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |