Taro-UI-Vue 邀你尝鲜,期待你的参与!
-
Taro
目前国内最受欢迎的跨端小程序之一,
Taro1.x
,Taro2.x
之前是使用jsx
语法编写, 是React
技术栈同学选择跨端框架的首选。在前不久Taro
发布了3.0
,拥有了对vue
语法的支持,对Vue
开发者来说算是福音了,使用非常简单。快速开始
# 使用 npm 安装 taro-CLI npm install -g @tarojs/cli
使用命令创建模板项目
# 使用 npm 安装 CLI taro init myApp
然后就可以开始你的
taro
之旅了。Taro-UI
个人是
Vue
技术栈,之前用过uni-app
做过小程序。后来转向Taro
很大一部分原因是因为Taro-UI
这个非常清新且高质量的官方的组件库,一套高质量的组件库绝对能可以让你的开发工作事半功倍。Taro-UI-Vue
Taro-UI-Vue
主要参考Taro UI
的实现,复用了其样式文件,写成vue
组件,配合Taro3.0
的vue
写法,拥有50+
组件,让vue
开发者拥有更多的选择。丰富的组件
(仅展示其中一部分)
如何使用Taro-UI-Vue
安装
npm i -S taro-ui-vue
按需引入
// page.js import { AtButton } from 'taro-ui-vue' // OR import AtButton from 'taro-ui-vue/src/components/button/index.vue'
按需引入样式
import 'taro-ui-vue/dist/style/components/tag.scss'
@import "~taro-ui/dist/style/components/button.scss";
小示例
<template> <view class="index"> <AtTag>标签</AtTag> <AtIcon value="clock" color="#F00"></AtIcon> </view> </template> <script> import { AtTag, AtIcon } from 'taro-ui-vue' import 'taro-ui-vue/dist/style/components/icon.scss' import 'taro-ui-vue/dist/style/components/tag.scss' export default { name: 'Index', components: { AtTag, AtIcon, } } </script>
更多内容可以参考官方文档
写在后面
此项目为 psaren 发起,承担了其中的绝大部分的工作。最近完善了文档和示例,让大家使用更加方便,目前项目还处于测试阶段,大家有使用中的问题可以提 issue, 我们将在最快的时间解决问题,当然,如果你有好的办法,可以直接提
PR
。有兴趣的同学可以一起参与进来,期待早日发布稳定版本。相关链接