Question

我正在尝试获得一个在子组件（模态组件）中显示每个收货阵列的物品列表，但一直无法做到。方法display_receipts（）用于将receives_modal的数据值更改为true。我可以在哪里放置v-bind通过数组？非常感谢您的帮助。

父母：

-- before insert
DELIMITER $$
CREATE TRIGGER `my_table_before_insert` BEFORE INSERT ON `my_table`
FOR EACH ROW
BEGIN
    CALL check_new_datetime(new.my_datetime);
END$$   
DELIMITER ; 

-- before update
DELIMITER $$
CREATE TRIGGER `my_table_before_update` BEFORE UPDATE ON `my_table`
FOR EACH ROW
BEGIN
    CALL check_new_datetime(new.my_datetime);
END$$
DELIMITER ;

孩子：

<modal-component v-if="receipts_modal"></modal-component>
<ul>
    <li v-for="item in items">{{ item.name }} 
    <span @click="display_receipts(item.receipts)">receipts</span>
    </li>
</ul>

Answer 1

您需要通过它作为道具，

<modal-component :receipts="receipts_modal" v-if="receipts_modal"></modal-component>

在子组件中您会收到它，这很好，但是您不会将它作为道具从父级发送出去

Answer 2

父组件：我在receipts: {}中添加了一个密钥data()。和方法display_receipts(item.receipts)将数据从循环传递到receipts{}中：

display_receipts(receipts) {
    this.receipts = receipts;
    this.receipts_modal = true;
}

vue js如何使用方法将数据从父级v-for循环列表传递到子组件

2 个答案: