所有分类
  • 所有分类
Taro UI多端组件库

Taro UI多端组件库

1、安装 Taro UI npm install taro-ui 2、h5编译设置 h5: { esnextModules: ['taro-ui'] } 3、项目中引入 方式一:js入口文件中引入 import 'taro-ui/dist/style/index.scss' 方式二:css全局入口文件中引入 @import "~taro-ui/dist/style/index.scss"; 4...

1、安装 Taro UI

npm install taro-ui

2、h5编译设置

h5: {

esnextModules: [‘taro-ui’]

}

3、项目中引入

方式一:js入口文件中引入

import ‘taro-ui/dist/style/index.scss’

方式二:css全局入口文件中引入

@import “~taro-ui/dist/style/index.scss”;

4、使用Taro UI

import Taro, { Component, Config } from ‘@tarojs/taro’

import { View } from ‘@tarojs/components’

import { AtButton } from ‘taro-ui’

import ‘./index.scss’

export default class Index extends Component {

config: Config = {

navigationBarTitleText: ‘首页’

}

render () {

return (

<View className=’index’>

<AtButton type=’primary’>按钮文案</AtButton>

</View>

)

}

}

5、运行

# npm script

$ npm run dev:weapp

# 仅限全局安装

$ taro build –type weapp –watch

# npx用户也可以使用

$ npx taro build –type weapp –watch

运行微信小程序工具查看效果,不懂操作的同学,请查看上一章节。

注意事项:

如果出现报错,可以尝试安装taro-ui版本,taro ui2.+版本跟目前的taro3.+版本不兼容,可以尝试使用以下命令

npm install taro-ui@3.0.0-alpha.3

纯手打,喜欢的同学请关注+收藏。

本页地址:http://www.uiya.cn/27227.html; 所有素材均来自于互联网,经网友投稿后发布,仅供学习请勿商用。如有侵权,请联系 3147141550@qq.com 或 提交工单

分享海报

评论0

站点公告

 

新注册用户福利,免费领取7~90天VIP会员

点击领取

没有账号? 注册  忘记密码?