javascript - vue melaporkan ralat semasa menghantar objek melalui prop
phpcn_u1582
phpcn_u1582 2017-05-19 10:42:21
0
5
851

Komponen induk App.vue

Subkomponen sonCp.vue

Struktur data

Ralat dilaporkan tetapi data boleh dipaparkan

Maafkan saya, tolong bantu saya menyemak sama ada cara saya mendapatkan data adalah betul.

phpcn_u1582
phpcn_u1582

membalas semua(5)
伊谢尔伦

Subkomponen pada mulanya mendapat rentetan kosong dan tidak mempunyai atribut seperti .acount.name, jadi ralat berlaku.

Penyelesaian paling mudah:

dalam komponen induk App.vue
<sonCp :dataObj="dataObj" />

Ditukar kepada:

<sonCp :dataObj="dataObj" v-if="dataObj" />
伊谢尔伦

Data yang diminta secara tidak segerak akan dipaparkan dua kali! Kali pertama adalah apabila permintaan tidak selesai Pada masa ini, obj dikembalikan oleh anda''. Kemudian apabila subkomponen mendapat nilai, ralat mesti berlaku! Kali kedua ialah apabila permintaan dikembalikan, dan kemudian terdapat data. Jadi penyelesaiannya jelas, terdapat banyak penyelesaian.

给我你的怀抱

Pada mulanya, dataObj ialah aksara nol, jadi ralat pasti akan dilaporkan apabila diserahkan kepada subkomponen Anda boleh menggunakan v-if untuk menentukan sama ada data telah diperoleh, dan kemudian menjadikannya selepas memperolehnya.

曾经蜡笔没有小新

1 Seperti yang dinyatakan di atas, nilai dataObj.length melalui v-if dalam dom untuk memastikan pemaparan apabila terdapat data (disyorkan!!)

.

2. Tetapkan struktur data objek dataObj dalam pilihan data komponen induk terlebih dahulu, seperti:

data() {
    return {
        dataObj: {
            id: '',
            account: {
                name: '',
                age: ''
            }
        }
      
    };
}

Selain itu, adalah disyorkan bahawa poster cuba memilih jenis data yang sesuai dan menetapkan nilai lalai apabila menempah item awal dalam pilihan data Contohnya, dataObj dalam komponen induk harus menyimpan jenis tatasusunan. Cuba dataObj: [], yang juga meningkatkan ungkapan semantik yang jelas.

为情所困
<son-cp :data-obj="dataObj"></son-cp>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!