Vue系列十六：vue组件

电玩女神 2022-01-30 06:51 335阅读 0赞

一、组件由三个部分组成
1、模板页面

  1. <template> 
  3. </template>

2、 JS 模块对象

  1. <script> 
  2.     export default{ 
  3.         data(){
  4.             return{}
  5.         }, 
  6.         methods:{}, 
  7.         computed:{}, 
  8.         components:{} 
  9.     } 
  10. </script>

3、样式

  1. <style>
  3. </style>

二、基本使用
1、引入组件
2、映射成标签。标签名与标签属性名书写问题：
（1）、写法一： 一模一样。 <HelloWorld></HelloWorld>
（2）、写法二： 大写变小写，并用-连接。<hello-world></hello-world>
3、使用组件标签

  1. <template> 
  2.     <HelloWorld></HelloWorld> 
  3.     <hello-world></hello-world> 
  4. </template> 
  6. <script> 
  8.     import HelloWorld from'./components/HelloWorld' 
  10.     export default{ 
  11.         components:{ 
  12.             HelloWorld 
  13.         } 
  14.     } 
  15. </script>

发表评论

表情：
评论列表 （有 0 条评论，335人围观）

还没有评论，来说两句吧...

相关阅读