使用Vue.js中的插槽更改组件中的变量后更新外部全局变量/全局vs.局部vs.组件变量

通过替换{{ '',(is_checked = is_checked_2) }}是否有更好的方法来实现相同目的?

问题在于变量 is_checked_2 是局部变量,仅在<div v-slot="{ is_checked_2 }"></div>的子节点中定义,并且目前无法通过作用域插槽将其设置为全局变量。

HTML代码:

<div id="app">
    <comp :is_checked="is_checked" v-slot="{ is_checked_2 }">
        {{ '',(is_checked = is_checked_2) }}
        <p>is_checked_2 = {{ is_checked_2 }} (local value)</p>
    </comp>
    <p>is_checked = {{ is_checked }} (global value)</p>
    <p>is_checked_2 = {{ is_checked_2 }} (global value)</p>
</div>

<script src="app.js"></script>

app.js

Vue.component("comp",{
  template: `
<div>
    <input type="checkbox" :checked="is_checked" v-model="is_checked">
    <p>is_checked = {{  is_checked }} (in component)</p>
    <slot :is_checked_2="is_checked"></slot>
</div>
`,props: ["is_checked"],});

new Vue({
  el: "#app",data: function() {
    return { is_checked: true,is_checked_2: false };
  }
});
avril_li 回答:使用Vue.js中的插槽更改组件中的变量后更新外部全局变量/全局vs.局部vs.组件变量

暂时没有好的解决方案,如果你有好的解决方案,请发邮件至:iooj@foxmail.com
本文链接:https://www.f2er.com/2755747.html

大家都在问