‘.vue’文件（非常重要）

最新推荐文章于 2022-09-13 14:26:23 发布

weixin_30758821

最新推荐文章于 2022-09-13 14:26:23 发布

阅读量289

点赞数 1

文章标签： javascript webpack ViewUI

原文链接：http://www.cnblogs.com/bwdblogs/p/11151002.html

版权

‘.vue’文件

Vue自定义了一种后缀名名字为.vue文件,它将html, js, css 整合成一个文件,和里面 template script style三个区别分别依次对应。

 
        <template> 
       
        <!--这里写 html --> 
       
        <template/> 
       
        <script> 
       
        export default {}; 
       
        // 这里写js 
       
        </script> 
       
        <style lang = "less" scoped> 
       
        <!--这里写css--> 
       
        </style>

一个.vue 文件就等于单独组件。因为.vue文件是自定义的，浏览器不识别，所以要对该文件进行解析,在webpack构建中，需要安装vue-loader 对.vue文件进行解析。
template里面最外层必须是只有一个容器
script 中的 export default {} 即导出这个组件，外部可以引用。
style 中的 lang 指额外表示支持的语言可以让编辑器识别,scoped 指这里写的css只适用于该组件。