reactjs - 如何将此useffect更改为react native中的类组件?
问题描述
我正在尝试将 useEffect、useState 更改为类组件,但我无法实现。在这里尝试使用多个选择选项做一个下拉选择器。我是反应原生的新手。非常感谢任何帮助。
我一直在尝试使用功能组件中的 react-native-element-dropdown NPM 包。现在尝试从功能组件更改为类组件。
这是代码:
import React, {useState} from 'react';
import {Dropdown, MultiSelect} from 'react-native-element-dropdown';
const data = [
{label: 'Item 1', value: '1'},
{label: 'Item 2', value: '2'},
{label: 'Item 3', value: '3'},
];
const DropdownScreen = _props => {
const [dropdown, setDropdown] = useState(null);
const [selected, setSelected] = useState([]);
const _renderItem = item => {
return (
<View style={styles.item}>
<Text style={styles.textItem}>{item.label}</Text>
<Image style={styles.icon} source={require('./assets/tick.png')} />
</View>
);
};
return (
<View style={styles.container}>
<Dropdown
style={styles.dropdown}
data={data}
search
searchPlaceholder="Search"
labelField="label"
valueField="value"
placeholder="Select item"
value={dropdown}
onChange={item => {
setDropdown(item.value);
console.log('selected', item);
}}
renderLeftIcon={() => (
<Image style={styles.icon} source={require('./assets/account.png')} />
)}
renderItem={item => _renderItem(item)}
/>
<MultiSelect
style={styles.dropdown2}
data={data}
labelField="label"
valueField="value"
placeholder="Select item"
search
searchPlaceholder="Search"
value={selected}
onChange={item => {
setSelected(item);
console.log('selected', item);
}}
renderItem={item => _renderItem(item)}
/>
</View>
);
};
export default DropdownScreen;
解决方案
const [dropdown, setDropdown] = useState(null);
作为:this.state= {dropdown: null}
setDropdown(item.value);
如:`this.setState({dropdown: item.value})
推荐阅读
- c++ - 具有来自同一类的回调的 Poco 计时器
- r - 如果字符串包含字母,如何将字符串转换为 R 中的数字?
- spring-batch - 自定义 ItemReader 的 Spring Batch MultiResourceItemReader 配置问题
- jenkins - 运行量角器脚本时如何在 Jenkins 中设置 chrome 浏览器窗口分辨率
- java - 写入输出流时套接字关闭?
- python - 如何在熊猫中保存 lmplot
- c# - 具有固定 Y 坐标的 ItextSharp 水平对齐问题
- c# - 拆分容器不会更新
- r - R将行分隔为由开始和结束指定的列
- jenkins - 如何在管道脚本中使 Jenkins 节点脱机