[英]Vue.js - Pass in Multiple Props to Child in V-For
I'm trying to create a table with collapsible columns, but can't get the table body to collapse with the headers. 我正在尝试使用可折叠列创建一个表,但无法使表头主体与标题一起折叠。 Here's a fiddle which makes it clear what I'm trying to do: https://jsfiddle.net/ufw4f5qc/9/ and here's a fiddle what I tried which is producing an error: https://jsfiddle.net/oafw74hz/2/
这是一个小提琴,它清楚地说明了我正在尝试做什么: https : //jsfiddle.net/ufw4f5qc/9/这里是一个小提琴我试过的产生错误: https : //jsfiddle.net/oafw74hz/ 2 /
The issue is most likely to do with scope of child and parent. 这个问题很可能与孩子和父母的范围有关。 I'm passing in a variable from parent to child using props, but it seems like the child does not take it.
我正在使用道具传递从父母到孩子的变量,但似乎孩子不接受它。 Am I binding the prop columnCollapsed correctly?
我是否正确绑定了prop columnCollapsed?
<tr is="data-row" v-for="record in recordsFiltered" v-bind:record="record" v-bind:columnCollapsed="columnCollapsed"></tr>
In console get the following errors: 在控制台中获取以下错误:
vue.js:2611 [Vue warn]: Error when rendering component
vue.js:2611 [Vue warn]:渲染组件时出错
Uncaught TypeError: Cannot read property 'Project' of undefined
未捕获的TypeError:无法读取未定义的属性“项目”
Side note: you may notice I repeated the code for some methods and filters (formatDollars, formatPercent, etc.) in both the parent and child component - if you have any tips on sharing this code between them do let me know! 旁注:您可能会注意到我在父组件和子组件中重复了一些方法和过滤器(formatDollars,formatPercent等)的代码 - 如果您有任何关于在它们之间共享此代码的提示,请告诉我们! : )
:)
Needed to do: 需要做的事:
:column-collapsed="columnCollapsed"
件:柱塌陷=“columnCollapsed”
Want hyphens in html, camelCase in JS. 想要html中的连字符,JS中的camelCase。
Hope this helps someone! 希望这有助于某人! (The answer was thanks to Bill Criswell)
(答案是感谢Bill Criswell)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.