❤️ 谢谢支持
喜欢的话别忘了 关注、点赞哦~。
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
template:“<div @click=‘count++’>{{count}}”,
data: function(){
return {count:0}
}
})
let vm1 = new Vue({
el:“#app”
})
let vm2 = new Vue({
el:“#app2”
})
let vm3 = new Vue({
el:“#app4”,
template:“”
})
局部注册:
哪个Vue实例注册了这个组件,只能这个实例的el匹配的元素范围内使用这个组件
new Vue({
el:“#app2”,
components:{
“ccy-component”:{
“template”:“
}
}
})
命名:
1.一般组件名命名为:你的名字 - 组件名,防止和别人的组件/原生组件串名
2.在局部组件中,组件名可以写成首字母大写式CcyComponent(驼峰式也可以),但在html中写成标签时只能用横杆ccy-component,否则模板不生效
举例:
vue实例中注册时可以用首字母大写式:
let vm2 = new Vue({
el:“#app2”,
components:{
“CcyComponent”:{
“template”:“
}
}
})
html标签名要写成横杆连接式,否则模板不生效:
html标签名用首字母大写式:
不能渲染出div标签,以及内容321
全局注册和局部注册的小demo:
// 全局组件
Vue.component(“ccy-movies”, {
template: “
- {{movie.name}}
data: function () {
return {
moviesList: [
{ name: “刺杀小说家” },
{ name: “你好李焕英” },
{ name: “哪吒重生” }
]
}
最后
全网独播-价值千万金融项目前端架构实战
从两道网易面试题-分析JavaScript底层机制
RESTful架构在Nodejs下的最佳实践
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
一线互联网企业如何初始化项目-做一个自己的vue-cli
思维无价,看我用Nodejs实现MVC
代码优雅的秘诀-用观察者模式深度解耦模块
前端高级实战,如何封装属于自己的JS库
VUE组件库级组件封装-高复用弹窗组件
2Mi1lOTdlMTZkMWYyNDZhNjUxZjA4ZThlZjdjZjRhZWRjZl9oZC5qcGc?x-oss-process=image/format,png)
VUE组件库级组件封装-高复用弹窗组件