import React, { useState, useCallback } from "react"; import { View } from "@tarojs/components"; import { LgSelepicker } from "lancoo-ui-mobile"; import "../index.scss"; export const Jsx = () => { const dataList = ["全部", "小学", "初中", "高中"]; const [choIndex, setChoIndex] = useState(0); const handleSelect = useCallback((value) => { const _choIndex = dataList.findIndex((item) => item === value); setChoIndex(_choIndex); }, []); return ( <View className="iframe__viewport"> <View className="viewport__title">B款下拉框</View> <View className="viewport__main"> <LgSelepicker type="B" dataList={dataList} choIndex={choIndex} changeSele={handleSelect} /> </View> </View> ); }; 改成类组件写法
时间: 2024-04-10 22:32:47 浏览: 114
import React, { Component } from "react";
import { View } from "@tarojs/components";
import { LgSelepicker } from "lancoo-ui-mobile";
import "../index.scss";
class Jsx extends Component {
constructor(props) {
super(props);
this.state = {
dataList: ["全部", "小学", "初中", "高中"],
choIndex: 0
};
}
handleSelect = (value) => {
const { dataList } = this.state;
const choIndex = dataList.findIndex((item) => item === value);
this.setState({ choIndex });
};
render() {
const { dataList, choIndex } = this.state;
return (
<View className="iframe__viewport">
<View className="viewport__title">B款下拉框</View>
<View className="viewport__main">
<LgSelepicker
type="B"
dataList={dataList}
choIndex={choIndex}
changeSele={this.handleSelect}
/>
</View>
</View>
);
}
}
export default Jsx;
阅读全文