问题
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/
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?
<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
Uncaught TypeError: Cannot read property 'Project' of undefined
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! : )
回答1:
Needed to do:
:column-collapsed="columnCollapsed"
Want hyphens in html, camelCase in JS.
Hope this helps someone! (The answer was thanks to Bill Criswell)
来源：https://stackoverflow.com/questions/41409732/vue-js-pass-in-multiple-props-to-child-in-v-for