子组件通过接口动态获取到的表单模板:
<view class=" uni-column" v-for="(item, index) in template" :key="index">
<view class="uni-column" v-if="item.type_level == 5">
<input
type="text"
@input="onKeyInput($event,item.question_id)"
:disabled="dis"
:name="item.question_id"
:value="item.value"
/>
</view>
<!-- 多项填空题 -->
<view class="uni-column" v-if="item.type_level == 6">
<view v-for="(con, indexCon) in item.select_question" :key="indexCon">
<text class="color-575757">{{ con.input_title }}</text>
<input
type="text"
:maxlength="item.number_of_characters"
class="moreinput"
:placeholder="con.input_title"
:disabled="dis"
:name="item.question_id"
v-model="con.value"
/>
</view>
</view>
<!-- 单选 -->
<view class="uni-column" v-if="item.type_level == 1">
<radio-group @change="radioChange($event, item.select_question, item.question_id)" class="uni-column radioGroup" :name="item.question_id">
<label class="radio" v-for="(ra, index) in item.select_question" :key="index">
<radio :value="ra.question_id" :checked="ra.input_title == infoVisaValue[item.question_id]" color="#DF2A00" :disabled="dis" />
{{ ra.input_title }}
</label>
</radio-group>
</view>
<!-- 多选 -->
<view class="uni-column" v-if=" item.type_level == 2">
<checkbox-group @change="checkboxChange($event, item.select_question, item.question_id)" :name="item.question_id">
<label class="uni-list-cell uni-list-cell-pd" v-for="type in item.select_question" :key="type.question_id">
<view><checkbox :value="type.question_id" :checked="type.checked" :disabled="dis" color="#DF2A00" /></view>
<view class="color-575757">{{ type.input_title }}</view>
</label>
</checkbox-group>
</view>
<!-- 下拉 -->
<view class="optionDef uni-column" v-if="item.type_level == 3">
<picker
@change="bindChinaChange($event, item.select_question, item.question_id,index)"
:value="dropDownIndex[index]"
:range="item.select_question"
:disabled="dis"
range-key="input_title"
:name="item.question_id"
>
<view class="uni-input uni-row dropDown">
<text class="color-575757">{{ item.select_question[dropDownIndex[index]]['input_title'] || i18n.quest.select }}</text>
<uniIcon size="20" type="arrowdown" color="#999" />
</view>
</picker>
</view>
<view class="redCheck" v-if="item.input_required == 1 ? true : false">此项必填</view>
</view>
父组件内容:
<form @submit="next">
<Template :dataVisa="template" :infoVisa="template_value"></Template>
<button formType="submit">{{i18n.nextStep}}</button>
</from>
请问我在提交表单的时候怎么去验证子组件中动态生成的表单值是否为空?next: function(e) {}里面不能获取到提交表单的值。我需要在表单提交的时候,判断如果有值为空,并且item.input_required = 1是必填项的时候就展示
`<view v-if="item.input_required == 1 && 为空 ? true : false">此项必填</view>
请问该怎么做呢?
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…