Vue js |如何访问脚本标记中的字段:type属性

Question

<div class="row">
<ValidationProvider v-slot="{errors, valid}" rules="required" class="col-md-6">
<b-field :label="$t('admin_global_username')" :type="{'is-success':valid, 'is-danger': errors[0]}" :message="errors && $t(errors[0])">
<b-input v-model="employeeModal.modalData.username" type="text" />
</b-field>
</ValidationProvider>
</div>

我正在使用Vee验证，我想要这个：伊夫b-field：输入是危险模式。用户无法转到其他页面。我如何知道脚本标记中的类型？

Answer 1

您可以向<b-field>添加模板引用，并直接在表单的submit-事件处理程序中检查其type属性：

<b-field ref="myField" />

export default {
methods: {
submit() {
if (this.$refs.myField.type === 'is-danger') {
alert('you shall not pass!')
} else {
console.log('submitting')
}
}
}
}

演示