kazupon / vue-validator

:white_check_mark: Validator component for Vue.js
MIT License
2.19k stars 431 forks source link

With a checkbox to get the value is wrong #349

Open xiyangjun opened 7 years ago

xiyangjun commented 7 years ago

vue & vue-validator version

2.0.3, 3.0.0-alpha.1

Reproduction Link

<div id="vue-test">
    <validation name="validation">
        <form class="form-horizontal">
            <div class="form-group">
                <label class="col-sm-3 control-label">checkbox</label>
                <div class="col-sm-9">
                    <validity-group field="checkbox" :validators="{fn: true}">
                        <label class="checkbox-inline" v-for="(item, index) in list">
                            <input type="checkbox" name="checktest" v-model="checkedList" :value="item.value"  @change="handleValidate">{{item.text}}
                        </label>
                    </validity-group>
                </div>
            </div>
        </form>
    </validation>
</div>
new Vue({
    el: '#vue-test',
    data: {
        list: [{value: 1, text: 'test1'}, {value: 2, text: 'test2'}],
        checkedList: []
    },
    validators: {
        fn: function (val) {
            console.log(val);
        }
    },
    methods: {
        handleValidate: function(e) {
            var $validity = e.target.$validity
            $validity.validate();
        }
    }
});

Steps to reproduce

checked test1 and test2

What is Expected?

expect => log out [1, 2]

What is actually happening?

actually =》 log out ["1", "2"]

xiyangjun commented 7 years ago

I think the wrong code here

MultiElement.prototype._getCheckedValue = function _getCheckedValue () {
  var value = [];
  this._eachItems(function (item) {
    if (!item.disabled && item.checked) {
      value.push(item.value);
    }
  });
  return value
};