1

Есть переменная которая изменяется в родительской компоненте, я передаю эту переменную в дочернюю компоненту и нужно сделать так чтобы эта переменная при изменении в род. компоненте сразу же менялась и в дочернем:

<template>
  <div>
      <AboutSection
        :changeInfo="changeInfo" // Передаю пропс
      />
      <IFbutton white :click="() => changeInfo = !changeInfo"> // Изменяю переменную
          Back
      </IFbutton>
  </div>
</template>

<script>
import AboutSection from "@/components/sections/about-section";
import IFbutton from "@/components/buttons/if-button";

export default {
  components: {
    IFbutton,
  },
  data() {
    return {
      changeInfo: false,
    };
  },
};
</script>

Проблема в том что когда я отслеживаю переменную в род. компоненте то все изменяется, но когда смотрю на нее через дочернюю, то она всегда false

<template>
    <section class="about-section">
        <b-row>
            <b-col offset="3" cols="4">
                <div class="about-section__description">
                    <p v-if="!changeInfo" class="body-3 about-section__description__text">
                        Test
                    </p>
                </div>
            </b-col>
        </b-row>
    </section>
</template>

<script>

export default {
    props: {
        changeInfo: {
            type: Boolean,
            required: false,
        },
    },
};
</script>

2
  • в дочернем компоненте используйте watch или computed
    – Dmytro
    3 фев 2021 в 11:03
  • Вы не обьявили компоненту "AboutSection"
    – fortavey
    3 фев 2021 в 11:04

1 ответ 1

0
<IFbutton white :click="() => changeInfo = !changeInfo"> // Изменяю переменную

В приведённом фрагменте вы не обрабатываете событие, а передаёте в качестве пропса с именем click для компонента IFbutton функцию.

Вам необходимо указать @click (либо использовать директиву v-on:, если кодстайл на вашем проекте это подразумевает), но, т. к. обработчик вешается на компонент, то необходимо добавить .native (больше про .native)

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.