UNPKG

3.17 kBTypeScriptView Raw
1import { ComponentType } from 'react'
2import { StandardProps } from './common'
3
4interface TextProps extends StandardProps {
5 /** 文本是否可选
6 * @default false
7 * @supported weapp, swan, alipay, tt, h5, rn
8 */
9 selectable?: boolean
10
11 /** 文本是否可选,该属性会使文本节点显示为 inline-block
12 * @default false
13 * @supported weapp
14 */
15 userSelect?: boolean
16
17 /** 显示连续空格
18 * @supported weapp, swan, tt
19 */
20 space?: keyof TextProps.TSpace
21
22 /** 是否解码
23 * @default false
24 * @supported weapp, tt
25 */
26 decode?: boolean
27}
28
29declare namespace TextProps {
30 /** space 的合法值 */
31 interface TSpace {
32 /** 中文字符空格一半大小 */
33 ensp
34 /** 中文字符空格大小 */
35 emsp
36 /** 根据字体设置的空格大小 */
37 nbsp
38 }
39}
40
41/** 文本
42 * @classification base
43 * @supported weapp, swan, alipay, tt, h5, rn
44 * @example_react
45 * ```tsx
46 * export default class PageView extends Component {
47 * state = {
48 * contents: [],
49 * contentsLen: 0
50 * }
51 *
52 * add = () => {
53 * this.setState(prev => {
54 * const cot = prev.contents.slice()
55 * cot.push({ text: 'hello world' })
56 * return {
57 * contents: cot,
58 * contentsLen: cot.length
59 * }
60 * })
61 * }
62 *
63 * remove = () => {
64 * this.setState(prev => {
65 * const cot = prev.contents.slice()
66 * cot.pop()
67 * return {
68 * contents: cot,
69 * contentsLen: cot.length
70 * }
71 * })
72 * }
73 *
74 * render () {
75 * return (
76 * <View className='container'>
77 * {this.state.contents.map((item, index) => (
78 * <Text key={index}>{item.text}</Text>
79 * ))}
80 * <Button className='btn-max-w button_style' plain type='default' onClick={this.add}>add line</Button>
81 * <Button className='btn-max-w button_style' plain type='default' disabled={this.state.contentsLen ? false : true} onClick={this.remove}>remove line</Button>
82 * </View>
83 * )
84 * }
85 * }
86 * ```
87 * @example_vue
88 * ``` html
89 * <template>
90 * <view class="container">
91 * <view v-for="(item, index) in contents">
92 * <text>{{item.text}} line {{index + 1}}</text>
93 * </view>
94 * <button class="btn-max-w button_style" :plain="true" type="default" `@tap="add">add line</button>
95 * <button class="btn-max-w button_style" :plain="true" type="default" :disabled="contentsLen ? false : true" `@tap="remove">remove line</button>
96 * </template>
97 *
98 * <script>
99 * export default {
100 * data() {
101 * return {
102 * contents: [],
103 * contentsLen: 0
104 * }
105 * },
106 * methods: {
107 * add () {
108 * const cot = this.contents.slice()
109 * cot.push({ text: 'hello world' })
110 * this.contents = cot
111 * this.contentsLen = cot.length
112 * },
113 *
114 * remove () {
115 * const cot = this.contents.slice()
116 * cot.pop()
117 * this.contents = cot
118 * this.contentsLen = cot.length
119 * }
120 * }
121 * }
122 * </script>
123 * ```
124 * @see https://developers.weixin.qq.com/miniprogram/dev/component/text.html
125 */
126declare const Text: ComponentType<TextProps>
127
128export { Text, TextProps }