Vue: ๋ฐ”์ธ๋”ฉ ๋œ ๋ฐ์ดํ„ฐ์— ๋ฐฑํ‹ฑ์ด ํฌํ•จ ๋œ ๊ฒฝ์šฐ ์ž˜๋ชป๋œ ๊ตฌ๋ฌธ ๋ถ„์„

์— ๋งŒ๋“  2016๋…„ 07์›” 14์ผ  ยท  5์ฝ”๋ฉ˜ํŠธ  ยท  ์ถœ์ฒ˜: vuejs/vue

Vue.js ๋ฒ„์ „

1.0.26

๋ณต์ œ ๋งํฌ

http://codepen.io/sirlancelot/pen/zBPVBo?editors=1010#0

์žฌํ˜„ ๋‹จ๊ณ„

  • ๋ฐฑํ‹ฑ ๋ฌธ์ž๊ฐ€ ํฌํ•จ ๋œ ๊ฐ’์œผ๋กœ ์ธ๋ผ์ธ ๊ฐœ์ฒด ๋ฐ”์ธ๋”ฉ

    ๋ฌด์—‡์„ ๊ธฐ๋Œ€ํ•ฉ๋‹ˆ๊นŒ?

  • ๋ฐ์ดํ„ฐ ๋ชจ๋ธ์—์„œ ๊ฐœ์ฒด๊ฐ€ ์˜ฌ๋ฐ”๋ฅด๊ฒŒ ์žฌํ˜„ ๋จ

    ์‹ค์ œ๋กœ ๋ฌด์Šจ ์ผ์ด ์ผ์–ด๋‚˜๊ณ  ์žˆ์Šต๋‹ˆ๊นŒ?

  • scope. ๋Š” ๋ฐฑํ‹ฑ๊ณผ ์ด์Šค์ผ€์ดํ”„ ๋œ ๋”ฐ์˜ดํ‘œ ์‚ฌ์ด์˜ ๋ชจ๋“  ํ•ญ๋ชฉ์— ์ถ”๊ฐ€๋ฉ๋‹ˆ๋‹ค.

์šฐ๋ฆฌ๋Š” ์„œ๋ฒ„์—์„œ ๋ธŒ๋ผ์šฐ์ €๋กœ ์ดˆ๊ธฐ ๋ฐ์ดํ„ฐ ๋ชจ๋ธ์„ ์ปค๋ฆฌํ•˜๊ธฐ ์œ„ํ•ด ์†Œํ’ˆ์„ ์‚ฌ์šฉํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค. CodePen์— ํ‘œ์‹œ๋œ ์˜ˆ์ œ์™€ ์œ ์‚ฌํ•œ ๋ฐฉ์‹์œผ๋กœ ์ˆ˜ํ–‰ํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค. ๊ธฐ๋ณธ์ ์œผ๋กœ ๋ฃจํŠธ Vue ์ธ์Šคํ„ด์Šค์—๋Š” ์š”์†Œ์— ํ‘œ์‹œ๋˜๊ณ  ์„œ๋ฒ„์— ์˜ํ•ด ์ฑ„์›Œ์ง€๋Š” ์†Œํ’ˆ ๋ชฉ๋ก์ด ํฌํ•จ๋˜์–ด ์žˆ์Šต๋‹ˆ๋‹ค.

๊ฐ€์žฅ ์œ ์šฉํ•œ ๋Œ“๊ธ€

@LinusBorg - ๋‚ด๊ฐ€ ์‚ฌ์šฉ https://www.debuggex.com/ ๋งค์šฐ ํŽธ๋ฆฌํ•ฉ๋‹ˆ๋‹ค!

๋ชจ๋“  5 ๋Œ“๊ธ€

์ž„์‹œ ํ•ด๊ฒฐ ๋ฐฉ๋ฒ•์œผ๋กœ ๋ฐฑํ‹ฑ์„ ์ด์Šค์ผ€์ดํ”„ํ•˜์—ฌ ๋ฌธ์ œ๋ฅผ ์šฐํšŒ ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

//broken
:items="[{'title':'one','value':1},{'title':'t`wo','value':2}]"

//works
:items="[{'title':'one','value':1},{'title':'t\`wo','value':2}]"

์กฐ์‚ฌํ•˜๋Š” ์‚ฌ๋žŒ์—๊ฒŒ๋Š” ๋ฐฐ์—ด์— ๋‹จ์ผ ์š”์†Œ ๋งŒ ํฌํ•จ๋˜์–ด ์žˆ์œผ๋ฉด ๋ฌธ์ œ๊ฐ€ ๋ฐœ์ƒํ•˜์ง€ ์•Š๋Š” ๊ฒƒ ๊ฐ™์Šต๋‹ˆ๋‹ค.

์ •๊ทœ์‹์„ ๋ณ€๊ฒฝํ–ˆ๋Š”๋ฐ ์ด์ œ ์ œ๋Œ€๋กœ ์ž‘๋™ํ•˜๋Š” ๊ฒƒ ๊ฐ™์Šต๋‹ˆ๋‹ค. ๊ทธ๋Ÿฌ๋‚˜ ์ด๊ฒƒ์€ ๋งค์šฐ ์ค‘์š”ํ•œ ์ •๊ทœ ํ‘œํ˜„์‹์ฒ˜๋Ÿผ ๋ณด์˜€๊ณ  ํŒจ์น˜๊ฐ€ ํ™•์‹คํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค.

์ „์—

screen shot 2016-07-19 at 10 45 27 pm

ํ›„

(๋นจ๊ฐ„์ƒ‰์œผ๋กœ ๊ฐ•์กฐ ํ‘œ์‹œํ–ˆ์Šต๋‹ˆ๋‹ค)

screen shot 2016-07-19 at 10 45 02 pm

@skyronic RegExp ๋„๊ตฌ๋Š” ๋ฌด์—‡์ž…๋‹ˆ๊นŒ? ๋งค์šฐ ์œ ์šฉ ํ•ด ๋ณด์ž…๋‹ˆ๋‹ค ...

@LinusBorg - ๋‚ด๊ฐ€ ์‚ฌ์šฉ https://www.debuggex.com/ ๋งค์šฐ ํŽธ๋ฆฌํ•ฉ๋‹ˆ๋‹ค!

@skyronic thx! http://rubular.com/ ์„ ๋งŽ์ด ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค. ๋ฃจ๋น„ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋กœ ํ…Œ์ŠคํŠธํ•˜์ง€๋งŒ ์ž˜ ์ž‘๋™ํ•ฉ๋‹ˆ๋‹ค.

์ด ํŽ˜์ด์ง€๊ฐ€ ๋„์›€์ด ๋˜์—ˆ๋‚˜์š”?
0 / 5 - 0 ๋“ฑ๊ธ‰