uniapp怎么自定义组件供其他页面调用

在使用uniapp开发中，其实很多功能我们可以抽离出来供其他页面调用的，比如底部的菜单栏、分享、登录等。 如果每个页面都写一遍，虽然可以直接复制粘贴，但是对于 后续维护来说代价是很大的，比如某个功能需要修改一下，那么所有运用到这个功能代码的页面都需要修改一遍。 显然这样太累了。可能有时粗心大意有些页面还遗漏了。 在这种场景下，我们该怎么做呢？因为uniapp是使用vue语法，同样支持vue组件功能。我们只需要在components目录下创建组件即可。 说了那么多，具体怎么实现呢？下面小超越就来给你解答一下。

1、在uniapp根目录下的components目录创建 自定义组件名.vue文件。代码如下：

[cc lang="html"] [/cc] 代码解读：里面最重要的一个就是props，通过定义里面的属性来传递参数，其他的写法都一样。

2、在其他页面调用该组件

首先要引用组件 [cc lang="html"]import 组件名称 from "../../components/组件名.vue"; //引用组件文件 //注册组件 export default{ components:{ 组件名称 }, } //在视图模板中使用组件 <组件名称 组件属性="对应的值">[/cc] 代码解读：如果名称用-字符隔开，那么在组件的时候，把名称的-后面的第一个字换成大写字母，比如组件名 shop-menu 那么组件名称为shopMenu。 以上就是使用uniapp抽离组件的方法。是不是很简单呢？你学会了吗？

如需转载请保留本文出处: https://www.zhe94.com/849.html