uniapp 结合 uview2.0实现设置性别

js yekong

uniapp开发每次设置性别都要重新写,很耗费时间干脆把写过的记录下来,下次可以直接复用。

html

<view @click="show=true" class="justify-between group_8">
                    <text class="text_6">性别</text>
                    <view class="flex-row group_9">
                        <text>{{sexname?sexname:"未设置"}}</text>
                        <image src="/static/remote/4d676f77aad365fac74d4b8ff09f39f2.png" class="icon_1 image_6" />
                    </view>
                </view>
<u-picker @confirm="getsex" @cancel="getcancel" :show="show" :columns="columns"></u-picker>

js

<script>
    export default {
        data() {
            return {
                show: false,
                columns: [
                    ['保密', '男', '女']
                ],
                sexname: '',
                sexid: '',
            }
        },
        onShow() {

        },
        methods: {
            getsex(e) {
                console.log(e)
                this.sexid = e.indexs[0]
                this.sexname = e.value[0]
                this.show = false
            },
            getcancel() {
                this.show = false
            },
        }
    }
</script>
喜欢