vue.js i radio buttons

[rePeter]

Pomóżcie bo mam pomroczność jasną,
nie potrafię elegancko powiązać vue z html w zakresie pól formularza.
Chodzi o pola typu radio, gdzie wynik wyboru powinien być powiązany z jedną zmienną vue
a chciałbym aby dane do pętli <li> były pobierane z jednego obiektu arrow
którego dwa pierwsze rekordy to właśnie parametry związane ze sobą pola wyboru type="radio" name="stala"
dalsze rekordy to różne pola mieszane które przechowują stany we własnych zmiennych np. arrow.dlugosc.value

Skrótem, jak spowodować aby arrow.stala.value i arrow.stala2.value były tą samą zmienną
przechowującą wybór?

html:
<ul>
<li v-for="item in arrow">
<label>
{{ item.label }}
<input :type="item.typ" :name="item.name" :value="item.v" v-model="item.value" > {{ item.units }}
</label>

vue.js:
var data = {
arrow: {
stala: {label: 'Stała:', typ: "radio", name: 'stala', v: 175, value: "", units: '175'},
stala2: {label: '', typ: "radio", name: 'stala', v: 150, value: "", units: '150'},
dlugosc: {label: 'długość:', typ: "text", value: "", units: 'mm'},
szerokosc: {label: 'szerokość:', typ: "text", value: "", units: 'mm'},
...

Z góry dzięki za sugestie.

[zpksoft]

Post by rePeter
Pomóżcie bo mam pomroczność jasną,
nie potrafię elegancko powiązać vue z html w zakresie pól formularza.
Chodzi o pola typu radio, gdzie wynik wyboru powinien być powiązany z jedną zmienną vue
a chciałbym aby dane do pętli <li> były pobierane z jednego obiektu arrow
którego dwa pierwsze rekordy to właśnie parametry związane ze sobą pola wyboru type="radio" name="stala"
dalsze rekordy to różne pola mieszane które przechowują stany we własnych zmiennych np. arrow.dlugosc.value
Skrótem, jak spowodować aby arrow.stala.value i arrow.stala2.value były tą samą zmienną
przechowującą wybór?
<ul>
<li v-for="item in arrow">
<label>
{{ item.label }}
<input :type="item.typ" :name="item.name" :value="item.v" v-model="item.value" > {{ item.units }}
</label>
var data = {
arrow: {
stala: {label: 'Stała:', typ: "radio", name: 'stala', v: 175, value: "", units: '175'},
stala2: {label: '', typ: "radio", name: 'stala', v: 150, value: "", units: '150'},
dlugosc: {label: 'długość:', typ: "text", value: "", units: 'mm'},
szerokosc: {label: 'szerokość:', typ: "text", value: "", units: 'mm'},
...
Z góry dzięki za sugestie.
--
pozdrawiam, Peter

zadeklarować zmienne jako obiekt a nie string? Wtedy mogły by wskazywać na to samo.

Paweł

[rePeter]

Fri, 22 Feb 2019 02:25:22 -0800 (PST)

Post by zpksoft

Post by rePeter
Pomóżcie bo mam pomroczność jasną,
nie potrafię elegancko powiązać vue z html w zakresie pól formularza.
Chodzi o pola typu radio, gdzie wynik wyboru powinien być powiązany z jedną zmienną
vue a chciałbym aby dane do pętli <li> były pobierane z jednego obiektu arrow
którego dwa pierwsze rekordy to właśnie parametry związane ze sobą pola wyboru
type="radio" name="stala" dalsze rekordy to różne pola mieszane które przechowują
stany we własnych zmiennych np. arrow.dlugosc.value
Skrótem, jak spowodować aby arrow.stala.value i arrow.stala2.value były tą samą
zmienną przechowującą wybór?
<ul>
<li v-for="item in arrow">
<label>
{{ item.label }}
<input :type="item.typ" :name="item.name" :value="item.v"
v-model="item.value" > {{ item.units }} </label>
var data = {
arrow: {
"", units: '150'}, dlugosc: {label: 'długość:', typ: "text", value: "", units: 'mm'},
szerokosc: {label: 'szerokość:', typ: "text", value: "", units: 'mm'},
...

zadeklarować zmienne jako obiekt a nie string? Wtedy mogły by wskazywać na to samo.

Dzięki za odpowiedź,
rozwiązałem już problem dodatkowym warunkiem ale sprawdzę jeszcze z
podstawieniem obiektu.