| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556 |
- <template>
- <div id="app">
- <fieldset>
- <legend>Dynamic validation with string (Working as expected)</legend>
- <input v-model="text" v-validate="rule('1')" autocomplete="off" type="text" :name="name1" />
- <span v-show="errors.has(name1)">{{ errors.first(name1) }}</span>
- <label>
- <input v-model="required" autocomplete="off" type="checkbox" />{{ required ? "" : "Not" }}
- Required
- </label>
- </fieldset>
- <fieldset>
- <legend>Dynamic validation with object (Working with issue)</legend>
- <input
- v-model="textObj"
- v-validate="ruleObj"
- autocomplete="off"
- type="text"
- name="inputObj"
- />
- <span v-show="errors.has('inputObj')">{{
- errors.first("inputObj")
- }}</span>
- <label>
- <input v-model="ruleObj.rules.required" autocomplete="off" type="checkbox" />{{
- ruleObj.rules.required ? "" : "Not"
- }}
- Required
- </label>
- </fieldset>
- </div>
- </template>
- <script>
- export default {
- data: function () {
- return {
- name1: 'name11',
- text: '',
- required: true,
- textObj: '',
- ruleObj: {
- rules: {
- required: true,
- },
- arg: 'textObj',
- },
- };
- },
- methods: {
- rule: function (value) {
- console.log(value);
- return this.required ? 'required' : '';
- },
- },
- };
- </script>
|