为什么我的组件无法接收道具数据?

时间:2019-10-15 17:11:01

标签: vue.js

我有一个按钮组件,它没有接收道具发送的数据。单击该按钮,我调用一个警报我的数据的方法,它返回“未定义”。遵循代码段。

<div class="ibox-content no-padding" style="font-size: 15px">
    <datatable :columns="tabela.columns" :data="tabela.rows"></datatable>
    <datatable-pager v-model="numeroPagina" type="abbreviated" :per-page="8"></datatable-pager>
</div>
    Vue.component('edit-button', {
        template: `
        <button class="btn btn-xs btn-primary" @click="goToUpdatePage">Edit</button>
    `,
        props: ['data'],
        methods: {
            goToUpdatePage: function(){
                alert(this.data)
            }
        }
    });

    export default {
        data() {
            return {
                cid: 'TESTE',

                tabela: {
                    columns: [
                        {
                            label: 'Descrição', representedAs: function (row) {
                                if (row.DESCRICAO) return ${row.DESCRICAO}
                                else return '<b>Sem informação</b>'
                            }, interpolate: true
                        },
                        {
                            label: 'Quantidade', representedAs: function (row) {
                                return ${row.QTD}
                            }, interpolate: true
                        },
                        {
                            label: '',
                            component: 'edit-button',
                            data: 'row',
                            component_data: {
                                path: 'contact',
                                action: 'update'
                            }
                        }

                    ],
                    rows: []
                }

            }
        },

...

我需要数据才能到达component方法。

0 个答案:

没有答案