Remove defaultProps from SegmentedControlIOS (#31804)
Summary: Issue https://github.com/facebook/react-native/issues/31604 . Remove `defaultProps` from `SegmentedControlIOS`. ## Changelog [JavaScript] [Changed] - Remove defaultProps from SegmentedControlIOS Pull Request resolved: https://github.com/facebook/react-native/pull/31804 Test Plan: Added tests for `SegmentedControlIOS` pass. Reviewed By: yungsters Differential Revision: D29653982 Pulled By: lunaleaps fbshipit-source-id: ed6e133cc3af629be6cd83be79e402ad1e68b29b
This commit is contained in:
Родитель
b5c94e316c
Коммит
fa0518d3d3
|
@ -19,6 +19,8 @@ type SegmentedControlIOSProps = $ReadOnly<{|
|
|||
...ViewProps,
|
||||
/**
|
||||
* The labels for the control's segment buttons, in order.
|
||||
*
|
||||
* The default value is an empty array.
|
||||
*/
|
||||
values?: $ReadOnlyArray<string>,
|
||||
/**
|
||||
|
@ -27,6 +29,8 @@ type SegmentedControlIOSProps = $ReadOnly<{|
|
|||
selectedIndex?: ?number,
|
||||
/**
|
||||
* If false the user won't be able to interact with the control.
|
||||
*
|
||||
* The default value is true.
|
||||
*/
|
||||
enabled?: boolean,
|
||||
/**
|
||||
|
@ -76,11 +80,6 @@ type Props = $ReadOnly<{|
|
|||
*/
|
||||
|
||||
class SegmentedControlIOS extends React.Component<Props> {
|
||||
static defaultProps = {
|
||||
values: [],
|
||||
enabled: true,
|
||||
};
|
||||
|
||||
_onChange = (event: SyntheticEvent<OnChangeEvent>) => {
|
||||
this.props.onChange && this.props.onChange(event);
|
||||
this.props.onValueChange &&
|
||||
|
@ -88,12 +87,21 @@ class SegmentedControlIOS extends React.Component<Props> {
|
|||
};
|
||||
|
||||
render() {
|
||||
const {forwardedRef, onValueChange, style, ...props} = this.props;
|
||||
const {
|
||||
enabled,
|
||||
forwardedRef,
|
||||
onValueChange,
|
||||
style,
|
||||
values,
|
||||
...props
|
||||
} = this.props;
|
||||
return (
|
||||
<RCTSegmentedControlNativeComponent
|
||||
{...props}
|
||||
ref={forwardedRef}
|
||||
style={[styles.segmentedControl, style]}
|
||||
enabled={enabled !== false}
|
||||
values={values ?? []}
|
||||
onChange={this._onChange}
|
||||
/>
|
||||
);
|
||||
|
|
|
@ -0,0 +1,55 @@
|
|||
/**
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*
|
||||
* @format
|
||||
* @emails oncall+react_native
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
const React = require('react');
|
||||
const ReactTestRenderer = require('react-test-renderer');
|
||||
|
||||
const SegmentedControlIOS = require('../SegmentedControlIOS.ios');
|
||||
|
||||
describe('SegmentedControlIOS', () => {
|
||||
it('renders the segmented control', () => {
|
||||
const component = ReactTestRenderer.create(<SegmentedControlIOS />);
|
||||
expect(component).not.toBeNull();
|
||||
});
|
||||
it('renders the segmented control with enabled default value', () => {
|
||||
const component = ReactTestRenderer.create(<SegmentedControlIOS />);
|
||||
expect(component.toTree().rendered.props.enabled).toBe(true);
|
||||
expect(component).toMatchSnapshot();
|
||||
});
|
||||
it('renders the segmented control with enabled', () => {
|
||||
const component = ReactTestRenderer.create(
|
||||
<SegmentedControlIOS enabled={true} />,
|
||||
);
|
||||
expect(component.toTree().rendered.props.enabled).toBe(true);
|
||||
expect(component).toMatchSnapshot();
|
||||
});
|
||||
it('renders the segmented control with enabled set to false', () => {
|
||||
const component = ReactTestRenderer.create(
|
||||
<SegmentedControlIOS enabled={false} />,
|
||||
);
|
||||
expect(component.toTree().rendered.props.enabled).toBe(false);
|
||||
expect(component).toMatchSnapshot();
|
||||
});
|
||||
it('renders the segmented control with values default value', () => {
|
||||
const component = ReactTestRenderer.create(<SegmentedControlIOS />);
|
||||
expect(component.toTree().rendered.props.values).toEqual([]);
|
||||
expect(component).toMatchSnapshot();
|
||||
});
|
||||
it('renders the segmented control with values', () => {
|
||||
const values = ['One', 'Two'];
|
||||
const component = ReactTestRenderer.create(
|
||||
<SegmentedControlIOS values={values} />,
|
||||
);
|
||||
expect(component.toTree().rendered.props.values).toBe(values);
|
||||
expect(component).toMatchSnapshot();
|
||||
});
|
||||
});
|
|
@ -0,0 +1,86 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`SegmentedControlIOS renders the segmented control with enabled 1`] = `
|
||||
<RCTSegmentedControl
|
||||
enabled={true}
|
||||
onChange={[Function]}
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"height": 28,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
values={Array []}
|
||||
/>
|
||||
`;
|
||||
|
||||
exports[`SegmentedControlIOS renders the segmented control with enabled default value 1`] = `
|
||||
<RCTSegmentedControl
|
||||
enabled={true}
|
||||
onChange={[Function]}
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"height": 28,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
values={Array []}
|
||||
/>
|
||||
`;
|
||||
|
||||
exports[`SegmentedControlIOS renders the segmented control with enabled set to false 1`] = `
|
||||
<RCTSegmentedControl
|
||||
enabled={false}
|
||||
onChange={[Function]}
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"height": 28,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
values={Array []}
|
||||
/>
|
||||
`;
|
||||
|
||||
exports[`SegmentedControlIOS renders the segmented control with values 1`] = `
|
||||
<RCTSegmentedControl
|
||||
enabled={true}
|
||||
onChange={[Function]}
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"height": 28,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
values={
|
||||
Array [
|
||||
"One",
|
||||
"Two",
|
||||
]
|
||||
}
|
||||
/>
|
||||
`;
|
||||
|
||||
exports[`SegmentedControlIOS renders the segmented control with values default value 1`] = `
|
||||
<RCTSegmentedControl
|
||||
enabled={true}
|
||||
onChange={[Function]}
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"height": 28,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
values={Array []}
|
||||
/>
|
||||
`;
|
Загрузка…
Ссылка в новой задаче