Обновление внешней глобальной переменной после того, как переменная в компоненте была изменена с использованием слота в Vue. js / глобальный по сравнению с локальной по сравнению с переменной компонента - PullRequest
0 голосов
/ 17 января 2020

Есть ли лучший способ добиться того же, заменив {{ '',(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 };
  }
});
...