开启辅助访问 切换到宽版

精易论坛

 找回密码
 注册

QQ登录

只需一步,快速开始

用微信号发送消息登录论坛

新人指南 邀请好友注册 - 我关注人的新帖 教你赚取精币 - 每日签到


求职/招聘- 论坛接单- 开发者大厅

论坛版规 总版规 - 建议/投诉 - 应聘版主 - 精华帖总集 积分说明 - 禁言标准 - 有奖举报

查看: 1166|回复: 0
收起左侧

[技术分享] 【零基础学会uniapp系列】7.2 组件库的使用

[复制链接]
发表于 2021-10-25 10:20:01 | 显示全部楼层 |阅读模式   广东省揭阳市
本帖最后由 项目部002 于 2021-10-26 15:26 编辑

7.2 组件库的使用

准备:新建项目时,选择新建 Hello uni-app模板,创建一个示例的组件库。

组件文档说明

组件库的使用
easycom组件规范 (自动引入组件)

HBuilderX 2.5.5起支持

传统vue组件,需要安装、引用、注册,三个步骤后才能使用组件。easycom将其精简为一步。

  • 组件安装在项目的components目录下或uni_modules目录下
  • 符合components或uni_modules/组件名称/组件名称.vue目录结构。

例如:components/uni-rate/uni-rate.vue

此时,uni-rate,不用在script里注册和引用,就可以直接使用了。

<template>
        <view>
            <uni-rate></uni-rate><!-- 这里会显示一个五角星,并且点击后会自动亮星 -->
        </view>
    </template>
<script>
    // 这里不用import引入,也不需要在components内注册uni-rate组件。template里就可以直接用
    export default {
        data() {
            return {

            }
        }
    }
</script>

不管components目录下安装了多少组件,easycom打包后会自动剔除没有使用的组件,对组件库的使用尤为友好。

easycom是自动开启的,不需要手动开启

手动引用组件

如果不使用easycom,手动引用和注册vue组件,则需要分3步写如下代码:

  • import导入组件

  • components里注册组件

  • template中使用组件

<template>
        <view>
            <uni-rate text="1"></uni-rate><!-- 3.使用组件 -->
        </view>
    </template>
    <script>
        import uniRate from '@/components/uni-rate/uni-rate.vue';//1.导入组件
        export default {
            components:{
                uniRate
            }//2.注册组件
        }
    </script>

本课参考链接:

https://uniapp.dcloud.net.cn/component/README?id=uniui

home.php?mod=space&uid=70631 课件下载、更多教程、遇到问题或者进行交流,请到: https://bbs.125.la/forum.php?mod=forumdisplay&fid=226 进行发帖交流

加QQ群:326576256




视频教程在线观看:https://www.eyuyan.tv/?mod=play&tvid=3226

课件下载: 【从资源网下载】

从GIT关注:
https://gitee.com/JYtechnology/uniapp-learn
您需要登录后才可以回帖 登录 | 注册

本版积分规则 致发广告者

发布主题 收藏帖子 返回列表

sitemap| 易语言源码| 易语言教程| 易语言论坛| 易语言模块| 手机版| 广告投放| 精易论坛
拒绝任何人以任何形式在本论坛发表与中华人民共和国法律相抵触的言论,本站内容均为会员发表,并不代表精易立场!
论坛帖子内容仅用于技术交流学习和研究的目的,严禁用于非法目的,否则造成一切后果自负!如帖子内容侵害到你的权益,请联系我们!
防范网络诈骗,远离网络犯罪 违法和不良信息举报电话0663-3422125,QQ: 793400750,邮箱:wp@125.la
Powered by Discuz! X3.4 揭阳市揭东区精易科技有限公司 ( 粤ICP备12094385号-1) 粤公网安备 44522102000125 增值电信业务经营许可证 粤B2-20192173

快速回复 返回顶部 返回列表