Vue--子组件如何直接使用父组件的部分数据？

Question

我正在学习 Vue.js。 在这里，我想设计一个这样的复选框组件：

    <xxx-checkbox-group>
        <xxx-checkbox></xx-checkbox>
        <xxx-checkbox></xx-checkbox>
    </xxx-checkbox-group>

以上是两种，父复选框组和子复选框。 复选框组使用<slot>来获取子组件并拥有一些必要的数据。 我希望孩子可以使用一些父母的数据（只是使用不改变）。 如果我在每个孩子的标签中都放一个属性，那就有点麻烦和低效了。

    <xxx-checkbox-group>
        <xxx-checkbox shape="square"></xx-checkbox>
        <xxx-checkbox shape="square"></xx-checkbox>
    </xxx-checkbox-group>

我可以通过其他方式传递价值吗？ 这样我就可以通过父母控制所有孩子的state。 我认为这是可能的，但我找不到实现这一目标的方法。

    <xxx-checkbox-group shape="square">
        <xxx-checkbox></xx-checkbox>
        <xxx-checkbox></xx-checkbox>
    </xxx-checkbox-group>

Answer 1

对我来说，您的意图并不完全清楚，那么您可以创建一个小的 jsfiddle 示例吗？

但一般来说，在子组件中，您可以通过this.$parent访问它的父 vue 实例以读取和更改属性。