一、在VUE官方中的解释
如图中解释很明显,component它的作用用于动态组件的渲染,我们可配置一个相关的json或者js文件,在某个路由里引入,这样就不必在一个页面里引入多个组件。
接下来,我将记录用数组去渲染动态组件。
老规矩,先讲我的前端环境,避免版本冲突,前端环境如下:
Node(14.17.5)、Npm(6.14.14),Vue-cli(4.5.15),Vue(2.6.14)
一、创建组件
在项目里,本人用的是ElementUi组件库。
在项目根目录下创建coderComponents文件夹,用来置放创建的组件。
1、新建一个index.js,引入组件并以模块的形式抛出。
代码如下:
2、举个例子,【elRate组件】,props中的config是该组件配置信息。
注意:组件的name不能和ElementUi组件库的name一样,在图中el-rate组件,它的name是elRate,那么这里的name不能取名为elRate,取名elRate的话会被当成ElementUi组件库的el-rate组件解析
三、引入组件
注意:在代码里,具体的config需要根据项目实际情况为主,一切以项目实际情况为主
初始的组件库通过本地配置好的json或者js来引入,这个一般由前端去配置修改,当然保存到数据库也可以,但是最好能可视化去修改初始的组件库
页面动态组件话通过请求后端接口来获取组件数据
四、总结****
个人观点:Component适用于低代码平台页面设计开发,它将减少大量的代码量。 如有不规范、需要优化地方、好建议请留言给我。
一起学习进步!