์ด์ ๊ฐ์ ์์ ์ ์ํํ๋ ค๋ฉด ์ด๋ป๊ฒ ํด์ผ ํฉ๋๊น?:
<script>
new Vue({
data: {
languages: ['english', 'japanese', 'chinese']
myLanguages: ['english', 'chinese']
}
});
</script>
<span v-repeat='language : languages'>
<input
type='checkbox'
value='{{ language }}'
v-model='myLanguages'>
</span>
์ ํํ ์ด๋ค ์ผ์ด ์ผ์ด๋๊ธฐ๋ฅผ ์ํ์ญ๋๊น?
์ฒดํฌ๋ฐ์ค ๋ชฉ๋ก๊ณผ ์ฒดํฌ๋ ์ํ๋ผ๋ฉด ์ธ์ด๋ฅผ ๋ฌธ์์ด์ด ์๋ ๊ฐ์ฒด๋ก ์ ์งํ ์ ์์ต๋๋ค.
<script>
new Vue({
data: {
languages: [
{name: 'english', checked:true},
{name: 'japanese', checked:false},
{name: 'chinese', checked:true}
]
}
});
</script>
<span v-repeat='language : languages'>
<input
type='checkbox'
value='{{ language.name }}'
v-model='language.checked'>
</span>
๊ทธ๋ฐ ๋ค์ ํํฐ/๋งต์ ์ฌ์ฉํ์ฌ ์ ํํ ์ธ์ด์ ์ด๋ฆ์ ๊ฒ์ํ ์ ์์ต๋๋ค.
๋ค์์ ๊ทธ๊ฒ์ ๋ณด์ฌ์ฃผ๋ jsfiddle์ ๋๋ค. http://jsfiddle.net/rmp135/v9vx9qyd/
๋๋ ์ ์ค ์ผ์ด์ค๊ฐ ์ฒดํฌ ๋ฐ์ค๋ฅผ ๋น์ทํ ๋ฐฉ์์ผ๋ก ์ฌ์ฉํ๋ ๊ฒ์ด๋ผ๊ณ ์๊ฐํฉ๋๋ค.
์ฌ๋ฌ ์ ํ ํญ๋ชฉ์ ์ ํํ ์ ์๋ ๊ธฐ๋ฅ๊ณผ ํจ๊ป ์ ํ ํญ๋ชฉ์ ์ฌ์ฉํฉ๋๋ค. ์ผ์ข
์
์ฒดํฌ ๊ฐ๋ฅ ํญ๋ชฉ์ด ์ด๋ ์ด์์ ์ค๋ "์ ์ฉ๋๋ ๋ชจ๋ ํญ๋ชฉ ํ์ธ" ์๋๋ฆฌ์ค
๊ฐ๋ฅ์ฑ์.
2015๋
7์ 12์ผ ์ค์ 9์ 43๋ถ์ "rmp135" [email protected]์ด ์์ฑํ์ต๋๋ค.
์ ํํ ์ด๋ค ์ผ์ด ์ผ์ด๋๊ธฐ๋ฅผ ์ํ์ญ๋๊น?
์ฒดํฌ๋ฐ์ค ๋ชฉ๋ก๊ณผ ์ฒดํฌ๋ ์ํ๋ผ๋ฉด
๋ฌธ์์ด์ด ์๋ ๊ฐ์ฒด๋ก์์ ์ธ์ด.
๊ทธ๋ฐ ๋ค์ ํํฐ/๋งต์ ์ฌ์ฉํ์ฌ ์ ํํ ์ด๋ฆ์ ๊ฒ์ํ ์ ์์ต๋๋ค.
์ธ์ด.๋ค์์ ๊ทธ๊ฒ์ ๋ณด์ฌ์ฃผ๋ jsfiddle์ ๋๋ค. http://jsfiddle.net/rmp135/v9vx9qyd/
โ
์ด ์ด๋ฉ์ผ์ ์ง์ ๋ต์ฅํ๊ฑฐ๋ GitHub์์ ํ์ธํ์ธ์.
https://github.com/yyx990803/vue/issues/1037#issuecomment -120721497.
์ค๋๋ ์: http://jsfiddle.net/yyx990803/1onz2ho7/1/
core repo ๋์ vuejs/Discussion์์ ์ด์ ๊ฐ์ ์ง๋ฌธ์ ์ฌ์ญ์์ค.
๊ฐ์ฅ ์ ์ฉํ ๋๊ธ
์ ํํ ์ด๋ค ์ผ์ด ์ผ์ด๋๊ธฐ๋ฅผ ์ํ์ญ๋๊น?
์ฒดํฌ๋ฐ์ค ๋ชฉ๋ก๊ณผ ์ฒดํฌ๋ ์ํ๋ผ๋ฉด ์ธ์ด๋ฅผ ๋ฌธ์์ด์ด ์๋ ๊ฐ์ฒด๋ก ์ ์งํ ์ ์์ต๋๋ค.
๊ทธ๋ฐ ๋ค์ ํํฐ/๋งต์ ์ฌ์ฉํ์ฌ ์ ํํ ์ธ์ด์ ์ด๋ฆ์ ๊ฒ์ํ ์ ์์ต๋๋ค.
๋ค์์ ๊ทธ๊ฒ์ ๋ณด์ฌ์ฃผ๋ jsfiddle์ ๋๋ค. http://jsfiddle.net/rmp135/v9vx9qyd/