Skip to content

Commit

Permalink
Merge branch 'dev' into feat_component_search_bar
Browse files Browse the repository at this point in the history
* dev:
  fix: #84 style 为null 处理
  fix(button): type - sendMessageTitle (#86)
  fix(action-sheet): 完善 UI 问题 #78
  fix(action-sheet): 修复 ActionSheetFooter 样式问题 closed #78
  fix(input): fix #85 types 错误
  docs: 对原生组件在Modal中的异常行为作出了说明 (#80)
  fix(input): onClick type optional
  fix(input): types
  • Loading branch information
jimczj committed Sep 28, 2018
2 parents 63acb61 + bad32f2 commit 8aad4c4
Show file tree
Hide file tree
Showing 9 changed files with 63 additions and 43 deletions.
2 changes: 1 addition & 1 deletion @types/button.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ export interface AtButtonProps extends AtComponent{
openType?: 'contact' | 'share' | 'getUserInfo' | 'getPhoneNumber' | 'launchApp' | 'openSetting' | 'feedback' | 'getRealnameAuthInfo'
lang?: string
sessionFrom?: string
sendMessageTitle: string,
sendMessageTitle?: string,
sendMessagePath?: string,
sendMessageImg?: string,
showMessageCard?: boolean,
Expand Down
20 changes: 14 additions & 6 deletions @types/input.d.ts
Original file line number Diff line number Diff line change
@@ -1,14 +1,12 @@
import { MouseEvent, ComponentClass } from 'react'
import { BaseEventFunction, BaseEvent } from '@tarojs/components/types/common'

declare type InputValue = string | number
declare type InputProp = string | number
declare type InputFunction = (value: string | number, event: BaseEvent) => void

import AtComponent from './base'

export interface AtInputProps extends AtComponent{
style?: string

name: string

title?: string
Expand All @@ -23,9 +21,9 @@ export interface AtInputProps extends AtComponent{

disabled?: boolean

maxlength?: number
maxlength?: InputProp

value?: InputValue
value?: InputProp

placeholder?: string

Expand All @@ -37,7 +35,15 @@ export interface AtInputProps extends AtComponent{

confirmType?: string

cursorSpacing?: number
cursor?: InputProp

selectionStart?: InputProp

selectionEnd?: InputProp

cursorSpacing?: InputProp

adjustPosition?: boolean

backgroundColor?: string

Expand All @@ -51,6 +57,8 @@ export interface AtInputProps extends AtComponent{

onConfirm?: InputFunction

onClick?: InputFunction

onErrorClick?: BaseEventFunction
}

Expand Down
2 changes: 2 additions & 0 deletions docs/markdown/modal.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,8 @@ import { AtModal, AtModalHeader, AtModalContent, AtModalAction } from 'taro-ui'

:::

> 由于微信小程序的限制,在 `Modal` 组件中使用一些客户端创建的原生组件(如:`textarea``input`等)时,即使 `Modal` 组件处于隐藏状态,原生组件依然会在页面上显示,具体参见微信小程序文档:[原生组件](https://developers.weixin.qq.com/miniprogram/dev/component/native-component.html)
## 一般用法

:::demo
Expand Down
6 changes: 4 additions & 2 deletions src/common/component.js
Original file line number Diff line number Diff line change
@@ -1,15 +1,17 @@
import Taro, { Component } from '@tarojs/taro'

const objectToString = style => {
if (typeof style === 'object') {
if (style && typeof style === 'object') {
let styleStr = ''
Object.keys(style).forEach(key => {
const lowerCaseKey = key.replace(/([A-Z])/g, '-$1').toLowerCase()
styleStr += `${lowerCaseKey}:${style[key]};`
})
return styleStr
} else if (style && typeof style === 'string') {
return style
}
return style
return ''
}

export default class AtComponent extends Component {
Expand Down
23 changes: 0 additions & 23 deletions src/components/action-sheet/footer/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,38 +10,15 @@ import AtComponent from '../../../common/component'
import './index.scss'

export default class AtActionSheetFooter extends AtComponent {
constructor () {
super(...arguments)
this.state = {
isIPhoneX: false
}
}

handleClick = (...args) => {
if (_isFunction(this.props.onClick)) {
this.props.onClick(...args)
}
}

componentDidMount () {
const curEnv = Taro.getEnv()

if (
curEnv === Taro.ENV_TYPE.WEAPP &&
Taro.getSystemInfoSync().model.indexOf('iPhone X') >= 0
) {
this.setState({ isIPhoneX: true })
}
}

render () {
const { isIPhoneX } = this.state

const rootClass = classNames(
'at-action-sheet-footer',
{
'at-action-sheet-footer--ipx': isIPhoneX
},
this.props.className
)

Expand Down
2 changes: 0 additions & 2 deletions src/components/action-sheet/footer/index.scss
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,6 @@
.at-action-sheet-footer {
font-size: $font-size-xl;
padding: $spacing-v-lg $spacing-h-lg;
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
border-top: 12px solid rgba($color: $color-border-base, $alpha: 0.3);
@include active();

Expand Down
17 changes: 15 additions & 2 deletions src/components/action-sheet/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ export default class AtActionSheet extends AtComponent {
const { isOpened } = props

this.state = {
isIPhoneX: false,
_isOpened: isOpened
}
}
Expand All @@ -34,6 +35,17 @@ export default class AtActionSheet extends AtComponent {
}
}

componentDidMount () {
const curEnv = Taro.getEnv()

if (
curEnv === Taro.ENV_TYPE.WEAPP &&
Taro.getSystemInfoSync().model.indexOf('iPhone X') >= 0
) {
this.setState({ isIPhoneX: true })
}
}

handleClose = () => {
if (_isFunction(this.props.onClose)) {
this.props.onClose()
Expand Down Expand Up @@ -62,12 +74,13 @@ export default class AtActionSheet extends AtComponent {

render () {
const { title, cancelText, className } = this.props
const { _isOpened } = this.state
const { _isOpened, isIPhoneX } = this.state

const rootClass = classNames(
'at-action-sheet',
{
'at-action-sheet--active': _isOpened
'at-action-sheet--active': _isOpened,
'at-action-sheet--ipx': isIPhoneX
},
className
)
Expand Down
7 changes: 6 additions & 1 deletion src/components/action-sheet/index.scss
Original file line number Diff line number Diff line change
Expand Up @@ -23,13 +23,18 @@ $action-sheet-timer: 300ms;
&__container {
bottom: 0;
width: 100%;
max-height: 50%;
text-align: center;
position: absolute;
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
background-color: $color-white;
transform: translate3d(0, 100%, 0);
transition: transform $action-sheet-timer $timing-func;
}

&--ipx &__container {
padding-bottom: 68px;
}
}

.at-action-sheet--active {
Expand Down
27 changes: 21 additions & 6 deletions src/components/input/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -54,18 +54,33 @@ export default class AtInput extends AtComponent {
PropTypes.string,
PropTypes.number
]),
name: '',
name: PropTypes.string,
placeholder: PropTypes.string,
placeholderStyle: PropTypes.string,
placeholderClass: PropTypes.string,
title: PropTypes.string,
confirmType: PropTypes.string,
cursor: PropTypes.number,
selectionStart: PropTypes.number,
selectionEnd: PropTypes.number,
cursor: PropTypes.oneOfType([
PropTypes.string,
PropTypes.number
]),
selectionStart: PropTypes.oneOfType([
PropTypes.string,
PropTypes.number
]),
selectionEnd: PropTypes.oneOfType([
PropTypes.string,
PropTypes.number
]),
adjustPosition: PropTypes.bool,
cursorSpacing: PropTypes.number,
maxlength: PropTypes.number,
cursorSpacing: PropTypes.oneOfType([
PropTypes.string,
PropTypes.number
]),
maxlength: PropTypes.oneOfType([
PropTypes.string,
PropTypes.number
]),
type: PropTypes.string,
disabled: PropTypes.bool,
border: PropTypes.bool,
Expand Down

0 comments on commit 8aad4c4

Please sign in to comment.