java - vue.js如何写checkbox.radio?

Question

我想用vue写checkbox.radio，这个怎么做呢
vue版本2.X
java springmvc

正常情况下会生成如下格式

<select>
    <option value>值1</option>
    <option value>值2</option>
</seltct>

一般情况下数据库里面放的是状态码 1,2。
而前台展示的时候显示的是值1，值2。
我如何直接输出值1，值2呢，我不想在后台进行值查询可以吗？
以前的JSP都是写个tag,直接把值转成html,现在vue我不知道怎么办了

Answer 1

首先，謝邀。

根據你的描述，是希望後台只存狀態值，然後將對應狀態值的content存在js的某個角落，當你需要渲染的時候，再根據對應狀態值，取出對應的content渲染到頁面

由於這種一般都是後台返回，但是這裡根據需求你也許可以這麼做

• 先在data中(或寫一個store檔案依序專門存放這些內容)

options: [
    '我是1',
    '我是2',
    '我是3',
    '我是4',
    '我是5',
    '我是6',
    '我是7',
    '我是8',
    '我是9',
    '我是10',
]

• 然後你可以在data裡寫一個接受後台傳來的狀態值

option_values: [
    0,
    2,
    4
]

• 根據這些在頁面上渲染效果

<select>
      <option value='item' v-for='item in option_values'>{{options[item]}}</option>
</select>

最終效果

不過，也不是什麼好辦法，因為對數組來說索引只能事數字了，就局限了狀態值的型態。以上是一種解決辦法。

---

那麼考慮到狀態值的多樣化，該怎麼做呢，講數組轉化為對象寫法
將上述第一步改為鍵值對形式

  options: {
    'option1':'我是1',
    'option2':'我是2',
    'option3':'我是3',
    'option4':'我是4',
    'option5':'我是5',
    'option6':'我是6',
    'option7':'我是7',
    'option8':'我是8',
    'option9':'我是9',
    'option10':'我是10',
  }

這麼寫的話原本我們傳來只能是數字類型的狀態值就可以很自然的變成

  option_values: [
    'option1',
    'option3',
    'option9'
  ]

這樣也能保證狀態值的多樣化。

最後建議，以後這種內容不對題的問題還是少些比較好，看下社區的規範有助於你快速找到答案。再次謝邀，希望可以幫到你，或是為你提供一些新的思路

Answer 2

謝邀。

你這個問題問的就不專業... 你標題想問checkbox.radio，內容裡面的程式碼卻是 select下拉框。

而且這個是及其基礎的問題。
如果值1，值2是後台提供的，你怎麼可能不進行查詢呢？
其實道理一樣，你在前端請求後台拿到資料之後，再去渲染頁面。