uniapp表单提交，传值picker

套用就好，里边有picker,input传值方法.

先上代码!!!

<template><view class="content"><!--用户id  --><!-- <view class="row b-b"><text class="tit">id号</text><input class="input" :value="UserInfo.uid" disabled  placeholder-class="placeholder" /></view> --><!-- 管理人id--><!-- <view class="row b-b"><text class="tit">id</text><input class="input" :value="userInfo.uid" disabled placeholder="请输入id" placeholder-class="placeholder" /></view> --><!-- 微信登录用户id --><!-- <view class="row b-b"><text class="tit">id</text><input class="input" :value="userInfo.uid" disabled placeholder="请输入id" placeholder-class="placeholder" /></view> --><!-- 用户账号 --><!-- 用户密码 --><!-- 真实姓名 --><view class="row b-b"><text class="tit">姓名</text><input class="input" type="text" v-model="addressData.realName1" placeholder="请输入真实姓名" placeholder-class="placeholder" /></view><!-- 性别 --><view class="row b-b"><view class="title">性别</view><radio-group @change="sexchange"><label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in sex" :key="item.value"><radio :value="item.value" :checked="item.checked" /><span>{{item.label}}</span></label></radio-group></view><!--出生日期 -->   <!-- 手机号 --><view class="row b-b"><text class="tit">手机号</text><input class="input" type="number" maxlength="11" v-model="addressData.mobile1" placeholder="请输入手机号码" placeholder-class="placeholder" /></view><!-- 常驻类型 --><view class="row b-b"><view class="title">常驻类型</view><radio-group @change="resideChange"><label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in reside" :key="item.value"><radio :value="item.value" :checked="item.checked" /><span>{{item.label}}</span></label></radio-group></view><!-- 民族 --><view class="row b-b"><view class="title">民族</view><radio-group @change="nationChange"><label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in nation" :key="item.value"><radio :value="item.value" :checked="item.checked" /><span>{{item.label}}</span></label></radio-group></view><!-- 血型 --><view class="row b-b"><view class="title">血型</view><radio-group @change="bloodYypeChange"><label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in bloodYype" :key="item.value"><radio :value="item.value" :checked="item.checked" /><span>{{item.label}}</span></label></radio-group></view><!-- 文化程度 --><view class="row b-b"><view class="title">文化程度</view><radio-group @change="standardCultureChange"><label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in standardCulture" :key="item.value"><radio :value="item.value" :checked="item.checked" /><span>{{item.label}}</span></label></radio-group></view><!-- 职业 --><view class="row b-b"><view class="title">职业</view><radio-group @change="professionChange"><label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in profession" :key="item.value"><radio :value="item.value" :checked="item.checked" /><span>{{item.label}}</span></label></radio-group></view><!-- 婚姻状况 --><view class="row b-b"><view class="title">婚姻状况</view><radio-group @change="marriageStatusChange"><label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in marriageStatus" :key="item.value"><radio :value="item.value" :checked="item.checked" /><span>{{item.label}}</span></label></radio-group></view><!-- 体检次数/每年 --><view class="row b-b"><text class="tit">体检次数/每年</text><input class="input" type="number"  v-model="addressData.examinationTimes1" placeholder="请输入体检次数" placeholder-class="placeholder" /></view><!--常用保健品 --><view class="row b-b"><view class="title">常用保健品</view><radio-group @change="healthProductsChange"><label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in healthProducts" :key="item.value"><radio :value="item.value" :checked="item.checked" /><span>{{item.label}}</span></label></radio-group></view><!-- 常锻炼 --><view class="row b-b"><view class="title">常锻炼</view><radio-group @change="takeExerciseChange"><label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in takeExercise" :key="item.value"><radio :value="item.value" :checked="item.checked" /><span>{{item.label}}</span></label></radio-group></view><!-- 常参加社区活动 --><view class="row b-b"><view class="title">常参加社区活动</view><radio-group @change="communityActivityChange"><label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in communityActivity" :key="item.value"><radio :value="item.value" :checked="item.checked" /><span>{{item.label}}</span></label></radio-group></view><!-- 健康调查 --><view class="row b-b"><view class="title">健康调查</view><radio-group @change="healthSurveyChange"><label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in healthSurvey" :key="item.value"><radio :value="item.value" :checked="item.checked" /><span>{{item.label}}</span></label></radio-group></view><!-- 亚健康描述 --><view class="row b-b"><text class="tit">亚健康描述</text><input class="input" type="text" v-model="addressData.subHealthRemark1" placeholder="亚健康描述" placeholder-class="placeholder" /></view><!-- xxxxxx --><view class="row b-b"><text class="tit">xxxxx</text><input class="input" type="number" v-model="addressData.xryTimes1" placeholder="xxxxxxx" placeholder-class="placeholder" /></view><!-- xxxxx --><view class="row b-b"><text class="tit">xxxx</text><input class="input" type="text" v-model="addressData.xryExperience1" placeholder="xxxx" placeholder-class="placeholder" /></view><!-- xxx --><view class="row b-b"><text class="tit">xxxx</text><input class="input" type="number" v-model="addressData.xqjTimes1" placeholder="xxxx" placeholder-class="placeholder" /></view><!-- xxxx --><view class="row b-b"><text class="tit">xxxx</text><input class="input" type="text" v-model="addressData.xqjExperience1" placeholder="xxxxx" placeholder-class="placeholder" /></view><!-- xxxx --><view class="row b-b"><text class="tit">xxxx</text><input class="input" type="number" v-model="addressData.fqsTimes1" placeholder="xxxx" placeholder-class="placeholder" /></view><!-- xxxx --><view class="row b-b"><text class="tit">xxxx</text><input class="input" type="text" v-model="addressData.fqsExperience1" placeholder="xxxx" placeholder-class="placeholder" /></view><!-- 创建时间 --><!-- 修改时间 --><view class="add-btn"><button @click="submit">Submit</button></view></view>
</template>
<script>
import { mapGetters } from "vuex";
import { VUE_APP_API_URL } from "@/config";
import { postUsermessage } from "@/api/user";export default {name: "PersonalData",components: {},data: function () {var app = getApp();return {sex: [{label: "男",value: 0,checked: true}, {label: "女",value: 1}],reside: [{label: "社区居民",value: 0,checked: true}, {label: "非社区",value: 1}],nation: [{label: "汉族",value: 0,checked: true}, {label: "少数民族",value: 1}],bloodYype: [{label: "A",value: 0,checked: true}, {label: "B",value: 1}, {label: "O",value: 2}, {label: "AB",value: 3}, {label: "不详",value: 4}],standardCulture: [{label: "文盲及半文盲",value: 0,checked: true}, {label: "小学",value: 1}, {label: "初中",value: 2}, {label: "高中/技校/中专",value: 3}, {label: "大学专科及以上",value: 4}, {label: "不详",value: 5}],profession: [{label: "国政机关事业单位人员",value: 0,checked: true}, {label: "企业主",value: 1}, {label: "个体户",value: 2}, {label: "务工人员",value: 3}, {label: "子女随迁",value: 4}],   marriageStatus: [{label: "未婚",value: 0,checked: true}, {label: "已婚",value: 1}, {label: "丧偶",value: 2}, {label: "离婚",value: 3}], healthProducts: [{label: "否",value: 0,checked: true}, {label: "是",value: 1}],   takeExercise: [{label: "否",value: 0,checked: true}, {label: "是",value: 1}], communityActivity: [{label: "否",value: 0,checked: true}, {label: "是",value: 1}],        healthSurvey: [{label: "高血压",value: 0,checked: true}, {label: "糖尿病",value: 1}, {label: "冠心病",value: 2}, {label: "慢性阻塞性肺炎疾病",value: 3}, {label: "恶性肿瘤",value: 4}, {label: "风湿病",value: 5}, {label: "痛风病",value: 6}, {label: "结核病",value: 7}, {label: "肝病",value: 8}, {label: "其他",value: 9}],                                                                                                                            userIndex: 0,avatar: "",realName1:'',mobile1:'',subHealthRemark1:'',marriageStatus1:'',xryTimes1:'',xryExperience1:'',xqjTimes1:'',xqjExperience1:'',fqsTimes1:'',fqsExperience1:'',addressData:{healthSurvey:0,communityActivity:0,takeExercise:0,healthProducts:0,marriageStatus:0,profession:0,standardCulture:0,bloodYype:0,nation:0,reside: 0,sex:0,} ,};},mounted: function () {},methods: {//健康调查healthSurveyChange(e) {this.addressData.healthSurvey = this.radio = e.detail.value},//常参加社区活动communityActivityChange(e) {this.addressData.communityActivity = this.radio = e.detail.value},//常锻炼takeExerciseChange(e) {this.addressData.takeExercise = this.radio = e.detail.value},//常用保健品healthProductsChange(e) {this.addressData.healthProducts = this.radio = e.detail.value},//婚姻状况marriageStatusChange(e) {this.addressData.marriageStatus = this.radio = e.detail.value},//职业professionChange(e) {this.addressData.profession = this.radio = e.detail.value},//文化程度standardCultureChange(e) {this.addressData.standardCulture = this.radio = e.detail.value},//血型bloodYypeChange(e) {this.addressData.bloodYype = this.radio = e.detail.value},//民族nationChange(e) {this.addressData.nation = this.radio = e.detail.value},//常驻类型resideChange(e) {this.addressData.reside = this.radio = e.detail.value},//性别sexchange(e) {this.addressData.sex = this.radio = e.detail.value},//提交submit(e){/* var data = e.detail.value */let data = this.addressDatapostUsermessage({realName: this.addressData.realName1,sex: this.addressData.sex,mobile: this.addressData.mobile1,reside: this.addressData.reside,nation: this.addressData.nation,bloodYype: this.addressData.bloodYype,standardCulture: this.addressData.standardCulture,profession: this.addressData.profession,marriageStatus: this.addressData.marriageStatus,examinationTimes: this.addressData.marriageStatus1,healthProducts: this.addressData.healthProducts,takeExercise: this.addressData.takeExercise,communityActivity: this.addressData.communityActivity,healthSurvey: this.addressData.healthSurvey,subHealthRemark: this.addressData.subHealthRemark1,xryTimes: this.addressData.xryTimes1,xryExperience: this.addressData.xryExperience1,xqjTimes: this.addressData.xqjTimes1,xqjExperience: this.addressData.xqjExperience1,fqsTimes: this.addressData.fqsTimes1,fqsExperience: this.addressData.fqsExperience1,}).then((res) => {handleOrderPayResults.call(this, res.data, "create", this.active);})}},
};
</script>
<style lang="scss">page {padding-top: 16upx;}.row {display: flex;align-items: center;position: relative;padding: 0 30upx;height: 110upx;background: #fff;.tit {flex-shrink: 0;width: 120upx;font-size: 30upx;float: left;}.input {padding-left: 35rpx;flex: 1;font-size: 30upx;}.icon-shouhuodizhi {font-size: 36upx;}}.add-btn {display: flex;align-items: center;justify-content: center;width: 690upx;height: 80upx;margin: 60upx auto;background-color: rgb(255, 41, 91);color: #fff;border-radius: 10upx;box-shadow: 1px 2px 5px rgba(28, 42, 134, 0.4);}
</style>

uniapp表单提交，传值picker相关推荐

uniapp 表单提交加上传文件
uniapp实现表单提交带图片上传在做表单提交的时候,我们可能面临有图片上传,放在原生的html就好解决,form标签加上 enctype="multipart/form-data&quo ...
uni-app 表单提交按钮发送请求
目前页面是以下这样代码部分 <html> 举一两个输入框的例子 <view class="content"><view class="ro ...
uniapp 表单提交图片跟其他填写数据_记录第一次实现表单数据提交到数据库
经过几周的Web前端学习我初步对.html文件.php文件有了一定的了解.首先我们来复习一下学过的知识.HTML页面实际上就是静态的网页页面,我们可以用html+css(层叠样式表)来创作出具有不同格 ...
ajax form表单提交_LayUI提交表单，监听select，分页组件
1.LayUI提交表单这几天做项目,用到提交layui框架的弹出层的表单,因为需要在提交表单后,关闭当前弹出层,同时刷新父窗口的数据,因此,用普通的提交就不行了,因为普通的提交到后台之后没有返回值, ...
mysql 提交按钮_表单提交按钮input和button、a的差异
现在普遍的在网页中,表单提交数据的按钮最常见实用有三种,一种是input,一种是button,最后一种,是其他如a标签,div标签,span标签代替而来.在以前的日子里,大家都习惯于用input,因为 ...
uni-app 表单验证
uni-app 表单验证 uni-app的内置组件已经有了组件,用于提交表单内容. 'uni-forms' 提供了 rules属性来描述校验规则.'uni-forms-item'子组件来包裹具体的表 ...
java ajax提交form表单提交_form表单AJAX提交（四种方法）
一.AJAX的 form表单提交 1.第一种: 序列化提交$('#form').serialize() 前台: $.ajax({ url: "", type: "post ...
php 判断提交表单提交,php判断form表单是否提交详解
php判断表单是否提交我们一般通过 submit 提交表单时,会在乎在表单中填写的一大堆数据是否提交到后台.这里就需要做个判断,使用php代码来判断表单数据是否被提交一般采用如下的形式:<?p ...
js将form表单提交数据封装为ajax提交
对于数据提交,html自带了form表单,以form表单里的input框的name为key值,以其所对应的value为value值,传给后台供其使用.但是这样的方法与ajax传输数据还是有许多差距: ...

uniapp表单提交，传值picker

uniapp表单提交，传值picker

uniapp表单提交，传值picker相关推荐

最新文章

热门文章