美文网首页
taro 微信小程序 react 地区选择器

taro 微信小程序 react 地区选择器

作者: 哑巴湖大水怪吖 | 来源:发表于2022-05-11 17:41 被阅读0次
    1⃣️ 引入
    import  area  from '@/assets/area/area.js'
    2⃣️  获取数据
    componentWillMount(){
        this.setState({
            regionData:area,
            })    
        }
    3⃣️ 组件
     <Picker customItem={customItem}   // 可为每一列的顶部添加一个自定义的项,很烦,我只想为区自定义一行而已
                    mode='region'  // 省市区选择器
                   onChange={this.bindRegionChange} value={region}  
     >
             <Input value={region} className='area' placeholder='请选择就业地区'>
                            {/* <View className='nameIpt'>
                             {region[0]},{region[1]},{region[2]}
             </Input>
           </Picker>
    4⃣️  选择的值改变时的方法
             // 省市区三级联动改变时的值
            bindRegionChange =  e => {
                // console.log('picker发送选择改变,携带值为', e.detail.value)
                // console.log('picker发送选择改变,携带值为', e.detail.code)
                if(e.detail.code.length == 2){
                    e.detail.code.push(e.detail.code[1])
                }
                this.setState({
                  region: e.detail.value,
                  province_id:e.detail.code[0],
                  city_id:e.detail.code[1],
                  district_id:e.detail.code[2],
                })
              }
    

    相关文章

      网友评论

          本文标题:taro 微信小程序 react 地区选择器

          本文链接:https://www.haomeiwen.com/subject/qsxjurtx.html