组件局部注册 · vue

# 局部组件： ## 语法解析： ``` var my_span ={ //注册一个局部组件 my_span是自定义名称 template:'<span>{{msg}}</span>', //这里相当于html部分如果多个标签就用`` 包裹 data:function (){ return{ msg:'hello vue' //这里的data要用函数返回 } } } ``` ## 以下为代码使用案例： ~~~ <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div id="app"> <my-span></my-span> </div> </body> </html> <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script> <script type="text/javascript"> var my_span ={ //注册一个局部组件 template:'<span> {{msg}}</span>', data:function (){ return{ msg:'hello vue' } } } //注册一个局部组件 --------------------以下为父组件--------------------- var vm=new Vue({ el:'#app', components:{ //一个对象 'my-span':my_span //注册子组件名称 'my-span' 为html自定义渲染标签 } }) </script> ~~~