vue|html5 form 验证
html:
<form id="scoreForm" @submit="fsub" > <template v-for="(item,index) in currentModel.childList"> <tr v-for="(it,inx) in item.childList" :key="inx"> <td>{{inx==0?item.childKey:''}}</td> <td>{{it.childKey}}</td> <td><input class="numInt" type="text" :pattern="getPattern(it.childValue)" v-model="it.childList" />/{{it.childValue}}</td> </tr> </template> </form> <button class="blueButton resetBtn" type="submit" form="scoreForm" @click="saveSupervise" style="height: .24rem;line-height: .24rem;float: right;margin-right: 15px;margin-bottom: 10px;" >提交</button>
fsub(e){ console.log('后执行‘);’ console.log('-------------submit'); e.preventDefault(); // 阻止表单提交 }, saveSupervise(){ console.log('先执行'); return true; // 放过表单提交 (下边表单开始验证:input 的 pattern ) return false //阻止表单提交 (此时阻止表单提交,也阻止了表单的验证)
}
如果完全手动验证可以用 form的 novalidate 属性