This repository was archived by the owner on Oct 27, 2021. It is now read-only.
Commit fe09dce 1 parent 36afed0 commit fe09dce Copy full SHA for fe09dce
File tree 6 files changed +10
-48
lines changed
packages/taro-ui-vue-docs
6 files changed +10
-48
lines changed Load Diff This file was deleted.
Original file line number Diff line number Diff line change @@ -20,15 +20,15 @@ Taro UI 的组件样式是使用 SCSS 编写的,如果你的项目中也使用
20
20
21
21
::: demo
22
22
``` scss
23
- /* 改变主题变量,具体变量名可查看 taro-ui/dist/style/variables/default.scss 文件 */
23
+ /* 改变主题变量,具体变量名可查看 taro-ui-vue /dist/style/variables/default.scss 文件 */
24
24
$color-brand : #6190E8 ;
25
25
26
26
/* 引入 Taro UI 默认样式 */
27
27
@import " ~taro-ui-vue/dist/style/index.scss" ;
28
28
```
29
29
:::
30
30
31
- > 覆写的变量,需要在引入 taro ui 默认样式之前定义,[ 默认主题变量命名] ( https://github.com/NervJS /taro-ui/blob/dev /src/style/variables/default.scss )
31
+ > 覆写的变量,需要在引入 taro ui vue 默认样式之前定义,[ 默认主题变量命名] ( https://github.com/psaren /taro-ui-vue /blob/master/packages/taro-ui-vue /src/style/variables/default.scss )
32
32
33
33
之后在项目的入口文件中引入以上的样式文件即可(无需重复引入组件的默认样式)
34
34
@@ -43,11 +43,11 @@ import './custom-variables.scss'
43
43
44
44
## 全局样式类
45
45
46
- 全局样式类是微信小程序定义的一套用于修改组件内部样式的方案。如果希望组件外样式类能够影响组件内部,可以在组件构造器中的 ` options.addGlobalClass ` 字段设置为 true(Taro UI 的组件均开启了此特性)。这个特性从小程序基础库版本 ` 2.2.3 ` 开始支持 。
46
+ 全局样式类是微信小程序定义的一套用于修改组件内部样式的方案。如果希望组件外样式类能够影响组件内部,可以在组件构造器中的 ` options.addGlobalClass ` 字段设置为 true(Taro UI Vue的组件均开启了此特性) 。
47
47
48
- ** P.S. ` addGlobalClass ` 这个 API 只对 Page 上的 class 起作用。换言之,如果在自定义的组件中使用 ` taro-ui ` ,是无法在自定义组件内部通过 ` 全局样式类 ` 的方式去更改组件样式的。**
48
+ ** P.S. ` addGlobalClass ` 这个 API 只对 Page 上的 class 起作用。换言之,如果在自定义的组件中使用 ` taro-ui-vue ` ,是无法在自定义组件内部通过 ` 全局样式类 ` 的方式去更改组件样式的。**
49
49
50
- > 当开放了全局样式类,存在外部样式无意间污染组件样式的风险。由于 Taro UI 的组件样式采用 BEM 的命名方式,从一定程度上避免了样式污染的问题。
50
+ > 当开放了全局样式类,存在外部样式无意间污染组件样式的风险。由于 Taro UI Vue的组件样式采用 BEM 的命名方式,从一定程度上避免了样式污染的问题。
51
51
52
52
::: demo
53
53
``` jsx
Original file line number Diff line number Diff line change 6
6
7
7
## 使用指南
8
8
9
- 如果已经全局引入了 ` taro-ui ` 的样式文件,则无需再次引入
9
+ 如果已经全局引入了 ` taro-ui-vue ` 的样式文件,则无需再次引入
10
10
11
11
> 由于 ` app.js ` 添加的样式文件 在小程序上只能影响 ` page ` 样式,不能影响 ` component ` 的样式,所以在使用自定义组件时,你可能需要再次引入
12
12
Original file line number Diff line number Diff line change 2
2
3
3
---
4
4
5
- 从底部弹起的滚动选择器,这里用的是微信小程序自带的 ` Picker ` 原生组件,` taro-ui ` 引用的是 ` taro ` 封装的基础组件。
5
+ 从底部弹起的滚动选择器,这里用的是微信小程序自带的 ` Picker ` 原生组件,` taro-ui-vue ` 引用的是 ` taro ` 封装的基础组件。
6
6
现支持四种选择器,通过 ` mode ` 来区分(默认是普通选择器),分别是:
7
7
- 普通选择器
8
8
- 多列选择器
Original file line number Diff line number Diff line change @@ -75,7 +75,7 @@ import 'taro-ui/dist/style/index.scss' // 全局引入一次即可
75
75
76
76
** 引入组件样式的三种方式**
77
77
78
- - ** 全局引入(JS中):** 在入口文件中引入 ` taro-ui ` 所有的样式
78
+ - ** 全局引入(JS中):** 在入口文件中引入 ` taro-ui-vue ` 所有的样式
79
79
::: demo
80
80
``` js
81
81
import ' taro-ui/dist/style/index.scss' // 引入组件样式 - 方式一
@@ -96,7 +96,7 @@ import 'taro-ui/dist/style/index.scss' // 引入组件样式 - 方式一
96
96
```
97
97
:::
98
98
99
- > 具体的组件样式文件请查看 [ 组件样式列表] ( https://github.com/NervJS /taro-ui/tree/dev/src/style /components )
99
+ > 具体的组件样式文件请查看 [ 组件样式列表] ( https://github.com/psaren /taro-ui-vue /tree/master/packages/taro-ui-vue/src /components )
100
100
101
101
## 示例
102
102
Original file line number Diff line number Diff line change @@ -57,7 +57,7 @@ class Index extends React.Component {
57
57
</ NavLink >
58
58
< a
59
59
className = 'btn btn-start btn-start--h5'
60
- href = 'https ://nervjs.github.io/ taro-ui/h5/index.html '
60
+ href = 'http ://taro-ui-vue-demo.fontend.com '
61
61
>
62
62
开始使用
63
63
</ a >
You can’t perform that action at this time.
0 commit comments