Vue JS, модальное окно через компоненты

#javascript #html #vue.js

#javascript #HTML #vue.js

Вопрос:

Мне нужно сделать модальное окно видимым по щелчку, я работаю через компоненты, новые конструкции Vue не работают Я никогда не работал с Vue, теперь я прошу помощи Ошибка: 64:4 ошибка ‘ShowModal:’ определена, но никогда не использовалась no-unused-labels

 <template>
<modalPhoto v-if="showModal == 'true'"></modalPhoto>
<div class="block-inputs">
    <div class="input-header">
        <h3>Photos</h3>
    </div>
    <div class="photos">
        <div class="photo-block">
            <img src="../assets/photo.jpg" class="photo modal-img" v-on:click="viewPhoto('true')">
        </div>  
    </div>
</div>
<div class="save-changes">
    <div style="margin: 0 auto;">
        <button class="button-add button-save">Save</button>
    </div>
</div>
  
 <script>
import modalPhoto from './modal/modalPhoto.vue';

export default {
    name: 'Photos',
    data() {
        showModal: false
    },
    methods: {
        viewPhoto() {
            this.showModal = true;
        }
    },
    components: {
        modalPhoto,
    }
}
  

Комментарии:

1. удалите одинарные кавычки в шаблоне ShowModal == ‘true’ и viewPhoto(‘true’) кстати, вам не нужна функция, которую вы можете сделать v-on:click=»ShowModal = true»

2. или используйте <modalPhoto v-if=»ShowModal»></modalPhoto>