Как в VUE сделать checkbox с возвратом '0' или '1'?

Question

[grigorie1990]

Здравствуйте,
У меня в базе данных в колонку проставляется 0 или 1 хочу чтобы чекбокс выдавал такие результаты, а он NULL или on.
Спасибо!

<template>
    <div>
       <input type="checkbox" name="coworker" v-bind:true-value="1" v-bind:false-value="0" v-model="coworker">
           <label for="checkbox">{{coworker}}</label>
    </div>
</template>

 export default {
        props: ['user'],
    
        data: function () {
            var user = JSON.parse(this.user);
            return {
                 coworker: user[0].coworker
            }
        },
}

Answer 1

[Владимир Проскурин]

У меня работает https://jsfiddle.net/wcx1o9ah/3/

Comments

[grigorie1990]

так то у меня тоже переключается на экране а в базу почемуто 'on' записывается, а если снять галочку то вообще не влияет

[Владимир Проскурин]

grigorie1990, значит дело именно в отправке в базу, а не в этом коде. Если вы отправляете форму стандартным способом, то атрибуты true-value и false-value игнорируются, и браузер не будет отправлять чекбокс, если он не активен. Поэтому на сервере у вас Null в случае "без галки" (т.к. параметр не отправляется) и on в случае включенной галки. Тут 2 варианта решения:
1) Сделать на сервере проверку этих полей, и в случае существования переменной (не Null), указывать 1, если Null то 0. Этот вариант предпочтительнее, т.к. если вы будете напрямую от клиента брать значение для поля таблицы и без проверки сохранять его, то пользователь может отправить вам много чего интересного в это поле, даже SQL-инъекцию.
2) Использовать Ajax для отправки формы в Vue, тогда и значение будет браться из true-value/false-value. Небезопасно см. выше.

[grigorie1990]

Vlad_IT, Огромное спасибо, сделал проверку все получилось!

Answer 2

[Roman K]

А чего не вот так? https://jsfiddle.net/deliro/1yaqj0o8/

Comments

[grigorie1990]

Спасибо, ваш код абсолютно правильно работает, это я немного неправильно сформулировал вопрос у меня была проблема с записью в саму базу, вместо 0 и 1 записывалось NULL и 'on', сделал проверку как посоветовали выше