使用uView插件中From表单中的性别下拉框使用方法

1：找到from 表单插件，在视图层输入

   

 

2：在对应的data数据中心，输入需要的数据

            form: {

                name: '',

                intro: '',

                sex: ''

            }

 

3：在插件中找到 ActionSheet 操作菜单，把

写在步骤 1 的下面

:tips="tips"：抬头内容

:list="list" ： 要选择的内容

 v-model="show"  绑定显示与隐藏

在数据中心输入

data() {

    return {

        tips: {

            text: '请选择性别',

            color: '#909399',

            fontSize: 24

        },

        list: [{

                    text: '男'

                },

                {

                    text: '女'

                }

                ],

        show: false

    }

}

 

4.因为是要点击输入框的时候希望他跳出来进行选择，所以在步骤 1 加上点击事件

   

5.这时候已经可以进行点击显示和隐藏了，在添加一个方法让你选择的内容出现在页面上就行了

actionSheetCallback(index) {

                uni.hideKeyboard();

                this.form.sex = this.list[index].text;

            },

 

完整代码如下：

Html部分：

Script部分：