动态组件,异步组件
2019-04-24 22:31
96 查看
- 动态组件
-
动态组件就是 component组件 , 组件身上可以绑定一个is属性, 用来表示某一个组件
- is属性
-
我们html中有一些标签是规定它的直接子元素的 , 比如 ul li ol li selector option table这类型标签
- 不能直接用常规的组件使用方式, 必须在对应直接子元素上绑定 is属性
<div id="app"> <table> <tr> <td>aa</td> <td>bb</td> <td>cc</td> </tr> <!-- is = 组件名称 --> <tr is = 'my-table'></tr> </table> </div>
- keep-alive组件
将组件的内容存在浏览器缓存中, 当我们需要重复渲染的时候, 就从浏览器缓存中去调用,这样可以减少性能消耗
<keep-alive> <component is = "A"></component> </keep-alive>
- 不常用指令
-
v-text vs v-html
都是用来将数据插入DOM中, 但是v-html可以解析标签类型数据
- v-cloak 解决 {{}} 语法短暂原样输出
- v-pre 原样输出
- v-once 只渲染一次
- 异步组件
-
异步组件也是一个函数, 只不过这个函数使用Promise,函数有一个返回值
<div id="app"> <async-com></async-com> </div>
var result = new Promise(function( resolve, reject ){ resolve({ template: '<div> 异步组件 </div>' }) }) Vue.component('AsyncCom',async () => { const tpl = await result.then( res => res) return tpl }) new Vue({ el: '#app' })
相关文章推荐
- Vue动态加载异步组件的方法
- react---react router4.0路由中如何异步动态加载组件,webpack使用require.ensure()生成异步chunk
- Vue动态组件和异步组件原理详解
- Vue动态组件与异步组件实例详解
- 动态组件、异步组件以及一些不常用指令
- 异步下载图片,动态设置cell高度
- Vue 组件4 动态组件
- 动态(异步模式)校验登录名是否存在
- [转载]利用FLV组件制作的播放器,动态获取变量,控制FLV文件
- Vue 组件5 高级异步组件
- 使用Vue开发动态刷新Echarts组件的教程详解
- [Flex] 动态获取组件宽度和高度
- mui中slider组件,动态加载后无法滚动切换问题的解决方法
- layui分页组件layPage动态调整总页数
- 设置组件状态--如何动态关闭manifest中的Receiver
- Angular动态注册组件(controller,service...)
- 动态添加组件到flex的可折叠容器中
- Android中动态更新View组件的大小
- Zend Framework使用Zend_Loader组件动态加载文件和类用法详解
- 页面动态数据的滚动效果——jquery滚动组件(vticker.js)