Vue.js 从json字符串访问vuejs中的值和键

我有一个json字符串，它列出了所有国家，例如：

AC:"Ascension Island"
AD:"Andorra"
AE:"United Arab Emirates"
AF:"Afghanistan"
AG:"Antigua & Barbuda"

我通过get请求获取值，并将其分配到如下数组：

        axios.get('/countries')
            .then(response => {
                this.countries = response.data;
            })


    data: function () 
    {
        return {
            countries: [],

但当我使用以下内容时，页面不会加载，也不会出现错误：

<select class="selectpicker" data-live-search="true" v-model="location" v-for="(value, key) in countries">  
    <option value="{{ key }}">{{ value }}</option>
</select>

{{value}}

您可以在vue中使用

<select class="selectpicker" data-live-search="true" v-model="location">
    <option :value="key" v-text="value" v-for="(value, key) in countries"></option>
</select>

---

请注意，无论您将v-for放在何处，都是将在DOM中重复的元素。在您的示例中，它将创建多个选择标记

将v-for移动到选项标记。上一个是相同的

您的响应是一个对象，其中两个字符的国家/地区值是属性？