Skip to content
This repository was archived by the owner on Oct 27, 2021. It is now read-only.

Commit 7a0bd9c

Browse files
psarenpsaren
committed
feat(components): JSX 内置组件需要从@tarojs/components 引入
1 parent e62d4ea commit 7a0bd9c

File tree

64 files changed

+616
-521
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

64 files changed

+616
-521
lines changed

‎config/formatTag.js

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
const fs = require('fs')
2+
const { resolve } = require('path')
3+
const glob = require('glob')
4+
5+
// 转换 小写 tag
6+
const formatTag = (file) => {
7+
let content = fs.readFileSync(file, { encoding: 'utf8' })
8+
9+
const matched = content.match(/<[a-z]+/g)
10+
11+
const matchedUniq = Array.from(new Set(matched))
12+
13+
const comps = matchedUniq.map((item) => {
14+
const tag = item.replace('<', '').replace(/[a-z]/, (p) => p.toUpperCase())
15+
content = content
16+
.replace(new RegExp('<' + tag, 'gi'), `<${tag}`)
17+
.replace(new RegExp(`</${tag}`, 'gi'), `</${tag}`)
18+
return tag
19+
})
20+
if (comps) {
21+
const compStr = comps.join(', ')
22+
23+
const impStr = `import { ${compStr} } from '@tarojs/components'\n`
24+
25+
fs.writeFileSync(file, impStr + content, { encoding: 'utf8' })
26+
}
27+
}
28+
29+
// 匹配 所有组件
30+
console.time('Time')
31+
glob(resolve(__dirname, '../src/components/**/*.[jt]sx'), {}, function (er, files) {
32+
files.forEach(formatTag)
33+
console.timeEnd('Time')
34+
})

‎package.json

+7-7
Original file line numberDiff line numberDiff line change
@@ -52,9 +52,9 @@
5252
"license": "MIT",
5353
"dependencies": {
5454
"@babel/runtime": "^7.7.7",
55-
"@tarojs/components": "3.0.0-beta.6",
56-
"@tarojs/runtime": "3.0.0-beta.6",
57-
"@tarojs/taro": "3.0.0-beta.6",
55+
"@tarojs/components": "3.0.0-rc.3",
56+
"@tarojs/runtime": "3.0.0-rc.3",
57+
"@tarojs/taro": "3.0.0-rc.3",
5858
"classnames": "^2.2.6",
5959
"dayjs": "^1.8.27",
6060
"lodash": "^4.17.15",
@@ -68,8 +68,8 @@
6868
"@rollup/plugin-commonjs": "^11.1.0",
6969
"@rollup/plugin-json": "^4.0.3",
7070
"@rollup/plugin-node-resolve": "^7.1.3",
71-
"@tarojs/mini-runner": "3.0.0-beta.6",
72-
"@tarojs/webpack-runner": "3.0.0-beta.6",
71+
"@tarojs/mini-runner": "3.0.0-rc.3",
72+
"@tarojs/webpack-runner": "3.0.0-rc.3",
7373
"@types/webpack-env": "^1.13.6",
7474
"@typescript-eslint/eslint-plugin": "^2.x",
7575
"@typescript-eslint/parser": "^2.x",
@@ -81,15 +81,15 @@
8181
"babel-jest": "^26.0.1",
8282
"babel-plugin-syntax-jsx": "^6.18.0",
8383
"babel-plugin-transform-vue-jsx": "^3.7.0",
84-
"babel-preset-taro": "3.0.0-beta.6",
84+
"babel-preset-taro": "3.0.0-rc.3",
8585
"babelrc-rollup": "^3.0.0",
8686
"conventional-changelog-cli": "^2.0.34",
8787
"copy-dir": "^1.2.0",
8888
"cross-env": "^7.0.2",
8989
"csstype": "^2.6.10",
9090
"eslint": "^6.8.0",
9191
"eslint-config-prettier": "^6.11.0",
92-
"eslint-config-taro": "3.0.0-beta.6",
92+
"eslint-config-taro": "3.0.0-rc.3",
9393
"eslint-plugin-prettier": "^3.1.3",
9494
"eslint-plugin-vue": "^6.2.2",
9595
"jest": "^26.0.1",

‎src/app.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@ import Vue from 'vue'
22
import store from './store'
33
import './app.scss'
44
// Vue.config.productionTip = false
5-
import TaroUi from '../dist'
6-
// import TaroUi from './index'
5+
// import TaroUi from '../dist'
6+
import TaroUi from './index'
77
Vue.use(TaroUi)
88

99
const App = new Vue({

‎src/components/accordion/index.jsx

+16-15
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { View } from '@tarojs/components'
12
import classNames from 'classnames'
23
import mixins from '../mixins'
34
import { delayQuerySelector } from '../../utils/common'
@@ -125,21 +126,21 @@ export default {
125126
}
126127

127128
return (
128-
<view class={rootCls} style={customStyle}>
129-
<view class={headerCls} onTap={this.handleClick}>
130-
{icon && icon.value && <view class={iconCls} style={iconStyle}></view>}
131-
<view class="at-accordion__info">
132-
<view class="at-accordion__info__title">{title}</view>
133-
<view class="at-accordion__info__note">{note}</view>
134-
</view>
135-
<view class={arrowCls}>
136-
<view class="at-icon at-icon-chevron-down"></view>
137-
</view>
138-
</view>
139-
<view style={contentStyle} class={contentCls}>
140-
<view class="at-accordion__body">{this.$slots.default}</view>
141-
</view>
142-
</view>
129+
<View class={rootCls} style={customStyle}>
130+
<View class={headerCls} onTap={this.handleClick}>
131+
{icon && icon.value && <View class={iconCls} style={iconStyle}></View>}
132+
<View class="at-accordion__info">
133+
<View class="at-accordion__info__title">{title}</View>
134+
<View class="at-accordion__info__note">{note}</View>
135+
</View>
136+
<View class={arrowCls}>
137+
<View class="at-icon at-icon-chevron-down"></View>
138+
</View>
139+
</View>
140+
<View style={contentStyle} class={contentCls}>
141+
<View class="at-accordion__body">{this.$slots.default}</View>
142+
</View>
143+
</View>
143144
)
144145
},
145146
}

‎src/components/action-sheet/body/index.jsx

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { View } from '@tarojs/components'
12
import classNames from 'classnames'
23

34
export default {
@@ -10,6 +11,6 @@ export default {
1011
},
1112
render() {
1213
const rootClass = classNames('at-action-sheet__body', this.className)
13-
return <view class={rootClass}>{this.$slots.default}</view>
14+
return <View class={rootClass}>{this.$slots.default}</View>
1415
},
1516
}

‎src/components/action-sheet/body/item/index.jsx

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { View } from '@tarojs/components'
12
import classNames from 'classnames'
23

34
export default {
@@ -21,9 +22,9 @@ export default {
2122
const rootClass = classNames('at-action-sheet__item', this.className)
2223

2324
return (
24-
<view class={rootClass} onTap={this.handleClick}>
25+
<View class={rootClass} onTap={this.handleClick}>
2526
{this.$slots.default}
26-
</view>
27+
</View>
2728
)
2829
},
2930
}

‎src/components/action-sheet/footer/index.jsx

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { View } from '@tarojs/components'
12
import classNames from 'classnames'
23

34
export default {
@@ -21,9 +22,9 @@ export default {
2122
const rootClass = classNames('at-action-sheet__footer', this.className)
2223

2324
return (
24-
<view onTap={this.handleClick} class={rootClass}>
25+
<View onTap={this.handleClick} class={rootClass}>
2526
{this.$slots.default}
26-
</view>
27+
</View>
2728
)
2829
},
2930
}

‎src/components/action-sheet/header/index.jsx

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { View } from '@tarojs/components'
12
import classNames from 'classnames'
23

34
export default {
@@ -11,6 +12,6 @@ export default {
1112
render() {
1213
const rootClass = classNames('at-action-sheet__header', this.className)
1314

14-
return <view class={rootClass}>{this.$slots.default}</view>
15+
return <View class={rootClass}>{this.$slots.default}</View>
1516
},
1617
}

‎src/components/action-sheet/index.jsx

+6-5
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { View } from '@tarojs/components'
12
import classNames from 'classnames'
23
import ActionSheetBody from './body/index'
34
import ActionSheetFooter from './footer/index'
@@ -72,18 +73,18 @@ export default {
7273
)
7374

7475
return (
75-
<view class={rootClass} onTouchMove={this.handleTouchMove}>
76-
<view onTap={this.close} class="at-action-sheet__overlay" />
77-
<view class="at-action-sheet__container">
76+
<View class={rootClass} onTouchMove={this.handleTouchMove}>
77+
<View onTap={this.close} class="at-action-sheet__overlay" />
78+
<View class="at-action-sheet__container">
7879
{title && <ActionSheetHeader>{title}</ActionSheetHeader>}
7980
<ActionSheetBody>{this.$slots.default}</ActionSheetBody>
8081
{cancelText && (
8182
<ActionSheetFooter props={{ onClick: this.handleCancel }}>
8283
{cancelText}
8384
</ActionSheetFooter>
8485
)}
85-
</view>
86-
</view>
86+
</View>
87+
</View>
8788
)
8889
},
8990
}

‎src/components/activity-indicator/index.jsx

+6-5
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { View } from '@tarojs/components'
12
import classNames from 'classnames'
23
import AtLoading from '../loading/index.jsx'
34

@@ -42,12 +43,12 @@ export default {
4243
)
4344

4445
return (
45-
<view class={rootClass}>
46-
<view class="at-activity-indicator__body">
46+
<View class={rootClass}>
47+
<View class="at-activity-indicator__body">
4748
<AtLoading size={size} color={color} />
48-
</view>
49-
{content && <view class="at-activity-indicator__content">{content}</view>}
50-
</view>
49+
</View>
50+
{content && <View class="at-activity-indicator__content">{content}</View>}
51+
</View>
5152
)
5253
},
5354
}

‎src/components/avatar/index.jsx

+5-4
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { View, Image } from '@tarojs/components'
12
import classNames from 'classnames'
23
import { getEnvs } from '../../utils/common'
34

@@ -57,11 +58,11 @@ export default {
5758
const isImage = !isOpenData && image !== ''
5859
const isText = !isOpenData && !image
5960
return (
60-
<view class={classNames(rootClassName, classObject, className)} style={customStyle}>
61+
<View class={classNames(rootClassName, classObject, className)} style={customStyle}>
6162
{isOpenData && <OpenData type={openData.type}></OpenData>}
62-
{isImage && <image class="at-avatar__img" src={image} />}
63-
{isText && <view class="at-avatar__text">{letter}</view>}
64-
</view>
63+
{isImage && <Image class="at-avatar__img" src={image} />}
64+
{isText && <View class="at-avatar__text">{letter}</View>}
65+
</View>
6566
)
6667
},
6768
}

‎src/components/badge/index.jsx

+5-4
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { View } from '@tarojs/components'
12
import classNames from 'classnames'
23

34
/**
@@ -46,14 +47,14 @@ export default {
4647

4748
const val = formatValue(value, maxValue)
4849
return (
49-
<view class={classNames(rootClassName, className)} style={customStyle}>
50+
<View class={classNames(rootClassName, className)} style={customStyle}>
5051
{this.$slots.default}
5152
{dot ? (
52-
<view class="at-badge__dot"></view>
53+
<View class="at-badge__dot"></View>
5354
) : (
54-
val !== '' && <view class="at-badge__num">{val}</view>
55+
val !== '' && <View class="at-badge__num">{val}</View>
5556
)}
56-
</view>
57+
</View>
5758
)
5859
},
5960
}

‎src/components/button/index.jsx

+12-11
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { Button, View, Form } from '@tarojs/components'
12
import AtLoading from '../loading/index.jsx'
23
import classNames from 'classnames'
34
import { getEnvs } from '../../utils/common'
@@ -217,14 +218,14 @@ export default {
217218
}
218219

219220
const webButton = (
220-
<button
221+
<Button
221222
class="at-button__wxbutton"
222223
lang={lang}
223-
formType={formType === 'submit' || formType === 'reset' ? formType : undefined}></button>
224+
formType={formType === 'submit' || formType === 'reset' ? formType : undefined}></Button>
224225
)
225226

226227
const button = (
227-
<button
228+
<Button
228229
class="at-button__wxbutton"
229230
formType={formType}
230231
openType={openType}
@@ -235,27 +236,27 @@ export default {
235236
sendMessageImg={sendMessageImg}
236237
showMessageCard={showMessageCard}
237238
appParameter={appParameter}
238-
{...{ on: this.getWxButtonProps() }}></button>
239+
{...{ on: this.getWxButtonProps() }}></Button>
239240
)
240241
return (
241-
<view
242+
<View
242243
onTap={this.hanldeClick}
243244
class={classNames(rootClassName, classObject, className)}
244245
style={customStyle}>
245246
{isWEB && !disabled && webButton}
246247
{isWEAPP && !disabled && (
247-
<form onSubmit={this.handleSubmit} onReset={this.handleReset}>
248+
<Form onSubmit={this.handleSubmit} onReset={this.handleReset}>
248249
{button}
249-
</form>
250+
</Form>
250251
)}
251252
{isALIPAY && !disabled && button}
252253
{loading && (
253-
<view class="at-button__icon">
254+
<View class="at-button__icon">
254255
<AtLoading color={loadingColor} size={loadingSize} />
255-
</view>
256+
</View>
256257
)}
257-
<view class="at-button__text">{this.$slots.default}</view>
258-
</view>
258+
<View class="at-button__text">{this.$slots.default}</View>
259+
</View>
259260
)
260261
},
261262
}

‎src/components/calendar/body/index.jsx

+9-8
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { View } from '@tarojs/components'
12
import Vue from 'vue'
23
import classnames from 'classnames'
34
import dayjs from 'dayjs'
@@ -273,30 +274,30 @@ const AtCalendarBody = Vue.extend({
273274

274275
if (!isSwiper) {
275276
return (
276-
<view
277+
<View
277278
class={classnames(
278279
'main',
279280
'at-calendar-slider__main',
280281
`at-calendar-slider__main--${process.env.TARO_ENV}`
281282
)}>
282283
<AtCalendarDayList />
283-
<view class="main__body body">
284-
<view class="body__slider body__slider--now">
284+
<View class="main__body body">
285+
<View class="body__slider body__slider--now">
285286
<AtCalendarDateList
286287
list={listGroup[1].list}
287288
props={{
288289
onClick: this.onDayClick,
289290
onLongClick: this.onLongClick,
290291
}}
291292
/>
292-
</view>
293-
</view>
294-
</view>
293+
</View>
294+
</View>
295+
</View>
295296
)
296297
}
297298

298299
return (
299-
<view
300+
<View
300301
class={classnames(
301302
'main',
302303
'at-calendar-slider__main',
@@ -327,7 +328,7 @@ const AtCalendarBody = Vue.extend({
327328
</SwiperItem>
328329
))}
329330
</Swiper>
330-
</view>
331+
</View>
331332
)
332333
},
333334
})

0 commit comments

Comments
 (0)