Vue: [Vue warn]: Properti atau metode "indeks" tidak ditentukan pada instance tetapi direferensikan selama render.

Dibuat pada 27 Sep 2016 · 3Komentar · Sumber: vuejs/vue

Versi Vue.js

2.0.0-rc.7

Apa yang sebenarnya terjadi?

Saya mencoba mengubah proyek 1.x vue saya menjadi 2.0.0, tetapi mendapat peringatan

main.js:20715 [Vue warn]: Properti atau metode "indeks" tidak ditentukan pada instance tetapi direferensikan selama render. Pastikan untuk mendeklarasikan properti data reaktif dalam opsi data. (ditemukan di komponen)

kode:

<template>
<div>
...
<a class="ui red label " v-for="(tag,index) in tags">
       {{tag}}
       <i class="delete icon" v-on:click="deleteTag(index)"></i>
 </a>
...
</div>
<template>
<script>

    module.exports = {
        data : function () {
            return {
                //form tags
                tags:[],
            }
        },
        methods : {

            deleteTag : function (deleteIndex) {
                this.tags.splice(deleteIndex,1);
            }
        }

    }

</script>

Apa yang harus saya lakukan untuk menghapus peringatan ini?

need repro

Sumber

Vwings

Komentar yang paling membantu

Akhirnya saya menemukan masalahnya. Saya lupa mengubah kode aslinya menjadi

(tab, indeks)

di file lain

memperingatkan:

<a class="item" v-for="tab in tabs" :class="{active : activeTab==index}" @click="toggleActiveTab(index)">
            {{tab.name}}
        </a>

tidak ada peringatan:

<a class="item" v-for="(tab,index) in tabs" :class="{active : activeTab==index}" @click="toggleActiveTab(index)">
            {{tab.name}}
        </a>

Vwings pada 28 Sep 2016

👍15 🎉2 ❤1

Semua 3 komentar

Akhirnya saya menemukan masalahnya. Saya lupa mengubah kode aslinya menjadi

(tab, indeks)

di file lain

memperingatkan:

<a class="item" v-for="tab in tabs" :class="{active : activeTab==index}" @click="toggleActiveTab(index)">
            {{tab.name}}
        </a>

tidak ada peringatan:

<a class="item" v-for="(tab,index) in tabs" :class="{active : activeTab==index}" @click="toggleActiveTab(index)">
            {{tab.name}}
        </a>

Vwings pada 28 Sep 2016

👍15 🎉2 ❤1

Pertama-tama maafkan saya untuk posting ini, tetapi saya sedang mengalami situasi yang sama ..

Versi Vue.js
2.1.6

Versi Vuex.js
2.1.1

file saya actions.js

 ekspor const addForm = ({ pengiriman }) => {
 pengiriman('TAMBAHKAN_FORM')
 }

 ekspor const deleteForm = ({ pengiriman }) => {
 pengiriman('DELETE_FORM')
 }

dan component.vue saya

 <template>
 < ul class="menu tarik-turun">
 <li>
 < a @click="addForm"> simpan</a> 
 < /li>
 <li>
 < a @click="deleteForm"> hapus</a>
 < /li>
 < /ul>
 < /templat>

ini hasilnya

vue.common.js?e881:519[Vue warn]: Properti atau metode "addForm" tidak ditentukan pada instance tetapi direferensikan selama render. Pastikan untuk mendeklarasikan properti data reaktif dalam opsi data.
vue.common.js?e881:519 [Vue warn]: Properti atau metode "deleteForm" tidak ditentukan pada instance tetapi direferensikan selama render. Pastikan untuk mendeklarasikan properti data reaktif dalam opsi data.

Apa yang harus saya lakukan untuk memperbaiki peringatan ini?

carvalhoviniciusluiz pada 28 Des 2016

@carvalhoviniciusluiz Anda seharusnya tidak mendefinisikan actions pada komponen, silakan merujuk ke: http://vuex.vuejs.org/en/actions.html#dispatching -actions-in-components