内联模板

什么是内联模板?对于一个初学者来说,官方不知所云的解释让人读完之后一脸茫然:

如果子组件有 inline-template 特性,组件将把它的内容当作它的模板,而不是把它当作分发内容。这让模板编写起来更灵活。

哦,带有inline-template就是内联模板,那它到底是怎么回事,又是怎么用的呢?


图像 1.png

看上图,1处定义了'child-component'组件,但是未指定模板;2处直接使用<child-component>标签,同时加上了inline-template属性。

所以:

inline-template的意思就是将html中的定义引入到vue中,作为其template使用。而不是像以前直接写成:

Vue.component('child-component', 
{template: '<h3>常规组件</h3>' 
})
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 下载安装搭建环境 可以选npm安装,或者简单下载一个开发版的vue.js文件 浏览器打开加载有vue的文档时,控制...
    冥冥2017阅读 6,104评论 0 42
  • Vue 实例 属性和方法 每个 Vue 实例都会代理其 data 对象里所有的属性:var data = { a:...
    云之外阅读 2,258评论 0 6
  • 这篇笔记主要包含 Vue 2 不同于 Vue 1 或者特有的内容,还有我对于 Vue 1.0 印象不深的内容。关于...
    云之外阅读 5,086评论 0 29
  • 1.安装 可以简单地在页面引入Vue.js作为独立版本,Vue即被注册为全局变量,可以在页面使用了。 如果希望搭建...
    Awey阅读 11,120评论 4 129
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,827评论 1 92