1、#160 #160 1#160 #160 在compoents文件夹中新建一个vue文件以Swiper为例#160 #160 2#160 #160 在mainjs中全局引入，先import再注册到VUE中 #160 #160 #160 #160 3。

2、在 vue 项目中，我们有了初始化的根实例后，所有页面基本上都是通过 router 来管理，组件也是通过 import 来进行局部注册，所以组件的创建我们不需要去关注，相比 extend 要更省心一点点但是这样做会有几个缺点这时候。

3、1引入swiper这里引入的是541版本在cmd命令行 cnpm install save swiper@541 2Swiper组件的封装封装方法参考swiper官网===srcviewsFilmSwipervue#1603在Film组件中使用swiper，并为轮播图。

4、封装可复用列表组件涉及到的vue 技术点 1props 父组件 把 请求api地址和请求参数传递给组件2vslot 作用域插槽 父组件可以访问子组件 item 数据，解耦UI布局3mintui Loadmore 组件 实现上拉加载更多我们在。

5、处理事件的方法尽量写在父组件中，以保证通用组件中的数据不被污染尽量使用props和自定义事件，因为当页面刷新时vuex会重新初始化，丢失已编辑的数据。

6、封装echars组件首先安装echarts#160 npm#160 echarts save 然后新建一个echarts文件夹，新建indexvue文件```lttemplate #160#160 lttemplate let#160Echarts#160=#160require#39echarts。

7、正常来说其实这个组件中是不需要写逻辑的，但是这里有个问题就是vue20中给自定义组件设置原生事件一定要加native修饰符，那如果使用的时候父组件忘记了呢所以这里给这个组件设定了个点击事件 这个change方法里其实只做了一。

8、最近在做一个vue的项目，独立封装树形组件先说一下项目需求1项目原型此树形结构分为三级根节点，一级节点，二级节点，每个节点都可以选中或取消选中，父级节点选中，下级的所有节点也可全部选中二级节点中有不可。

9、vue 默认情况下，父组件是可以直接给子组件的根元素添加 class 和 style 的，但是有时候我们可能需要在父组件上给子组件添加一些特性绑定 attribute bindings 我的理解是自定义属性和一些原生属性到子组件的根元素上。

10、符号打不出来了，将就着看吧如果还是不明白 atters和 listeners是怎么回事的可以看一下vue官网中的介绍看官网又出了一种封装的写法，感觉挺有意思，在这里记录一下默认情况下，组件上的 vmodel 使用 modelValue。

11、1在components下新建一个RemoteSearchvue文件或者新建一个文件夹，命名RemoteSearch，下面加入一个indexvue文件命名都是自己随意的2RemoteSearchvue文件内容如下 3使用。

12、也可以使用 createVNode + render 这对组合 也支持直接导入函数使用 import Toast from #39@srccomponentsToast#39注 本篇文章使用了 typescript ，如果你是使用的 javascript，只需要把类型去掉即可。

13、这里主要自己使用yaml1封装 codemirror 组件2页面用 watch 监控form表单，将json转yaml更新视图 3利用 emit 编辑内容时调用页面里的yaml转json更新form表单。

14、network状态在appvue中控制着一个全局的断网提示组件的显示隐藏 关于断网组件中的刷新重新获取数据，会在断网组件中说明 Message showClose true， message #39断网了，请检查网络链接#39， type quoterrorquot， duration 2000。

15、动态修改的vue2能用vue3是用于vue的自定义组件封装动态修改的，因此是封装的组件组件是数据和方法的封装，就是指一组数据可以提供一些操作实现一些简单的功能，比如用户查询组件。