如何在vue組件中創建數組？

我VUE成分是這樣的：如何在vue組件中創建數組？

<template> 
    ... 
     <ul class="list-unstyled"> 
      <li v-for="category in categories"> 
       ... 
        <input type="checkbox" :value="category.id" :checked="category.id in_array(categoryCountry)"> 
       ... 
      </li> 
     </ul> 
    ... 
</template> 

<script> 
    export default { 
     props: ['categoryCountry', 'categories'], 
    } 
</script>

我想在輸入更改狀態

categoryCountry是陣列，例如array(1,2,3)

所以，如果category.id在categoryCountry的陣列，然後將其將檢查

我該怎麼辦？

來源

2017-10-20 samuel toh

最好的和簡單的答案。使用「包含」它檢查數據是否存在於數組中。

例如：在你的代碼

[].includes(something);

答案。

<input type="checkbox" :value="category.id" :checked="categoryCountry.includes(category.id)">

來源

2017-10-20 02:40:55 Kenneth

這正是我寫的 – user618509

使用V-如果你可以通過一個功能，所以，你可以在VUE的方法來檢查您輸入您的陣列狀

checkInArray: (needle, haystack) { 
    return haystack.includes(needle) 
}

的

<input v-if="checkInArray(categoryCountry, categories)"

Array.prototype.includes （）返回一個布爾值真/假這足以滿足條件v-如果

來源

2017-10-20 01:45:22 user618509

您試試看嗎？似乎代碼是錯誤的 –

是的，我知道它的工作原理。 – user618509

嘗試使用http://jsfiddle.net/ –

如果收到的陣列和需要顯示該陣列的每個項目作爲輸入複選框你應該通過每個迭代數組項：

// Template example 
<div id='check_box_sample'> 
    <div v-for="category in categoryCountries"> 
    <input 
     type="checkbox" 
     :id="category" 
     :value="category" 
     v-model="checkedCategories"> 
    <label 
     :for="category"> 
     {{ category }} 
    </label> 
    </div> 
    <br> 
    <span>Checked names: {{ checkedCategories }}</span> 
</div>

因此，對於每個迭代v-for="category in categoryCountries"您創建一個輸入型的複選框，你必須定義一個id :id="category"和值:value="category"，因爲這只是一個簡單的例子，我只是使用相同的數組項。

您可能希望看到一個working example

我希望這可以幫助您。

來源

2017-10-20 02:36:30 ricardoorellana

如何在vue組件中創建數組？

回答

相關問題