uni-app教程二(微信开发者工具运行项目,icon字体使用,组件)

3. 自定义组件

根目录下创建components目录,创建list.vue组件

{{item.title}}

  1. 父组件我的页面my.vue,引入自定义组件list.vue,并传参

最终效果:

在这里插入图片描述

3. uni-ui的使用

1)uni-ui 是全端兼容的基于flex布局的ui库;

2)可以使用 npm 的安装使用方式,也可下载相关组件直接使用;

3)uni-ui

不支持使用 Vue.use() 的方式安装

4)uni-ui 依赖 scss,若是 HBuilderX 中创建的 uni-app

项目,需要在 HBuilderX 中安装 scss 插件;如果是使用 cli 创建的 uni-app 项目,需要在项目下npm安装node-sass 和 sass-loader

1. 初始化项目

在 HBuilderX 中新建 uni-app 项目,进入项目目录,执行:

npm init -y

2. 安装 uni-ui

npm install @dcloudio/uni-ui

3. 使用 uni-ui

index.vue引入组件,在template中使用

helloword

<uni-pagination

show-icon=false

total=100

pageSize=10

current=2

prev-text=“上一页”

next-text=“下一页”

  • 5
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值