Skip to content

Commit

Permalink
Merge pull request #702 from XiaoMi/hotfix/#695
Browse files Browse the repository at this point in the history 
fix: #696 #703 #704 #667
  • Loading branch information
@solarjoker
solarjoker authored Oct 10, 2019
2 parents a05f655 + 9dd095c commit 3cac0a0
Show file tree
Hide file tree
Showing 6 changed files with 45 additions and 29 deletions.
3 changes: 3 additions & 0 deletions components/carousel/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,9 @@ class Carousel extends Component {
if (active >= this.props.children.length) {
active = 0
}
if (active < 0) {
active = this.props.children.length + active
}
this.setState({
active
})
Expand Down
19 changes: 11 additions & 8 deletions components/cascader/Cascader.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import ReactDOM from 'react-dom'
import classNames from 'classnames'
import PropTypes from 'prop-types'
import debounce from 'lodash/debounce'
import isEqual from 'lodash/isEqual'
import shallowequal from 'shallowequal'
import Popper from '../popper'
import Menu from './Menu'
Expand All @@ -25,7 +26,8 @@ class Cascader extends Component {
style: PropTypes.object,
onActiveItemChange: PropTypes.func,
onChange: PropTypes.func,
displayRender: PropTypes.func
displayRender: PropTypes.func,
filterOption: PropTypes.func
}

static defaultProps = {
Expand Down Expand Up @@ -65,8 +67,8 @@ class Cascader extends Component {
}

componentWillReceiveProps (nextProps) {
if (!shallowequal(nextProps.value, this.props.value)) {
const cascaderLabel = this.getCascaderLabel(nextProps.value)
if (!shallowequal(nextProps.value, this.props.value) || !isEqual(nextProps.data, this.props.data)) {
const cascaderLabel = this.getCascaderLabel(nextProps.value, nextProps.data)
this.setState({
cacheValue: nextProps.value, // 缓存原始value，用户可能点击option但是没选中，用于恢复初始value
cascaderLabel
Expand Down Expand Up @@ -108,7 +110,7 @@ class Cascader extends Component {
this.inputRef.focus()
}

getCascaderLabel (values) {
getCascaderLabel (values, data) {
if (this.props.displayRender) {
return this.props.displayRender(values)
}
Expand All @@ -117,7 +119,7 @@ class Cascader extends Component {
} else {
let labels = []
let index = 0
let _options = this.props.data
let _options = data || this.props.data
const labelKey = this.labelKey()
const valueKey = this.valueKey()
const childrenKey = this.childrenKey()
Expand Down Expand Up @@ -173,7 +175,8 @@ class Cascader extends Component {

onKeywordChange () {
const {
data
data,
filterOption: filterFunc
} = this.props
const {
keyword
Expand All @@ -194,7 +197,7 @@ class Cascader extends Component {
let label = option[labelKey]
const value = option[valueKey]
const children = option[childrenKey]
if (label.toString().indexOf(keyword) > -1 || value.toString().indexOf(keyword) > -1) {
if ((filterFunc && filterFunc(keyword, option)) || label.toString().includes(keyword) || value.toString().includes(keyword)) {
match.matchCount++
}
match.options.push({
Expand All @@ -210,7 +213,7 @@ class Cascader extends Component {
filterOptions.push(match.options.slice())
}
}
if (label.toString().indexOf(keyword) > -1 || value.toString().indexOf(keyword) > -1) {
if ((filterFunc && filterFunc(keyword, option)) || label.toString().includes(keyword) || value.toString().includes(keyword)) {
match.matchCount--
}
match.options.pop()
Expand Down
3 changes: 2 additions & 1 deletion components/pagination/Pagination.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -134,7 +134,8 @@ class Pagination extends Component {
clearable={false}
style={{ width: 120 }}
data={pageSizeOptions.map(n => ({
id: n,
// 这里的类型判断是考虑对过去的兼容写法
id: typeof n === 'object' ? n.value : n,
title: `${n} ${i18nItem}/${i18nItemPerPage}`
}))}
value={pageSize}
Expand Down
8 changes: 4 additions & 4 deletions docs/demo/cascader/section-advanced.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -74,7 +74,7 @@ class Demo extends React.Component {
value: 'goodsId',
children: 'subGoods',
}}
options={this.state.options}
data={this.state.options}
style={{width: '240px'}}
/>
)
Expand Down Expand Up @@ -146,7 +146,7 @@ class Demo extends React.Component {
onChange={(value)=>{
console.log('on change', value)
}}
options={this.state.options}
data={this.state.options}
style={{ width: 240 }}
displayRender={values => {
return values.join(' > ')
Expand Down Expand Up @@ -265,7 +265,7 @@ class Demo extends React.Component {
}}
noFoundTip="未搜索到相关内容"
searchable={true}
options={this.state.options}
data={this.state.options}
style={{ width: 240 }}
/>
)
Expand Down Expand Up @@ -383,7 +383,7 @@ class Demo extends React.Component {
onChange={(value)=>{
console.log('on change', value)
}}
options={this.state.options}
data={this.state.options}
style={{ width: 240 }}
onActiveItemChange={values=>{
if(values[0] == 'mix') {
Expand Down
29 changes: 15 additions & 14 deletions docs/zh-CN/components/cascader.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,20 +28,21 @@ import { Badge } from '@libs'

## Props

| 参数 | 说明 | 类型 | 可选值 | 默认值 |
| -------------- | ------------------------------------------------- | --------------------------- | ------------- | ------------------------------------------------------- |
| fieldNames | 设置 options 中 label, value, children 对应的 key | object | - | { label: 'label', value: 'value', children: 'children'} |
| data | 设置选择项数据源 | DataItem[] | - | - |
| value | 设置当前选中值 | string[] | - | [] |
| searchable | 是否可搜索 | boolean | true \| false | false |
| clearable | 是否可清空 | boolean | true \| false | true |
| disabled | 是否禁止使用 | boolean | true \| false | false |
| changeOnSelect | 是否启用选择即改变功能 | boolean | true \| false | false |
| placeholder | 输入框占位 | string | - | '请选择' |
| emptyContent | 设置选项为空时展示的内容 | string \| ReactNode | - | '无匹配数据' |
| displayRender | 自定义选择后展示的内容 | (value: string[]) => string | - | - |
| style | 自定义样式 | object | - | - |
| onChange | 选择后的回调 | (value: string[]) => void | - | - |
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
| -------------- | -------------------------------------------------------------------------------------------------------- | -------------------------------------------- | ------------- | ------------------------------------------------------- |
| fieldNames | 设置 options 中 label, value, children 对应的 key | object | - | { label: 'label', value: 'value', children: 'children'} |
| data | 设置选择项数据源 | DataItem[] | - | - |
| value | 设置当前选中值 | string[] | - | [] |
| searchable | 是否可搜索 | boolean | true \| false | false |
| filterOption | 第一个参数为输入的关键字，第二个为数据项，返回值为 true 时将出现在结果项。仅在 searchable 为 true 时有效 | (keyword: string, item: DataItem) => boolean | - | - |
| clearable | 是否可清空 | boolean | true \| false | true |
| disabled | 是否禁止使用 | boolean | true \| false | false |
| changeOnSelect | 是否启用选择即改变功能 | boolean | true \| false | false |
| placeholder | 输入框占位 | string | - | '请选择' |
| emptyContent | 设置选项为空时展示的内容 | string \| ReactNode | - | '无匹配数据' |
| displayRender | 自定义选择后展示的内容 | (value: string[]) => string | - | - |
| style | 自定义样式 | object | - | - |
| onChange | 选择后的回调 | (value: string[]) => void | - | - |

## Type

Expand Down
12 changes: 10 additions & 2 deletions docs/zh-CN/components/date-picker.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -91,16 +91,24 @@ import DemoModal from '../../demo/date-picker/section-modal.jsx'
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
| ----------- | --------------------------------- | -------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------- | ------ |
| type | 选择器类型 | string | date 普通日期 <br/> daterange 日期范围<br/> year 年份<br/> month 月份<br/> week 周<br/> weekrange 周范围 <br/> timeperiod 时间段（1.5 新增） | date |
| value | 默认显示的日期 | Date \| string \| number\| object \| undefined \| null | -- | null |
| value | 默认显示的日期 | Date \| string \| number\| DateRange \| undefined \| null | - | null |
| minDate | 最小日期 | Date | null | null |
| maxDate | 最大日期 | Date | null | null |
| disabled | 是否禁用输入框 | boolean | true \| false | false |
| clearable | 是否可以清空 | boolean | true \| false | true |
| showTime | 是否在日期选择器中显示时间选择器 | boolean | true \| false | false |
| shortcuts | 快捷面板 | string[] | 近一周, 近一月, 近三月, 近一年 | null |
| weekOffset | 周起始<br/>默认周日做为第一列 | number | 0/1 | 0 |
| weekOffset | 周起始<br/>默认周日做为第一列 | number | 0 \| 1 | 0 |
| placeholder | 自定义占位符<br/>数组用于范围日期 | string \| string[] | - | - |


## Type
### DateRange
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
| -------- | --------------- | ---------------- | ------ | ------ |
| start | 起始时间 | Date \| string \| number \| undefined \| null | - | - |
| end | 截止时间 | Date \| string \| number \| undefined \| null | - | - |

## Methods

`DatePicker.format(date: Date, format: string)`
Expand Down

0 comments on commit 3cac0a0

Please sign in to comment.