Vue@click.native가 작동하지 않습니까?

Vue@click.native가 작동하지 않습니까?

다음과 같은 내비게이션 구성 요소가 있습니다.

<template>
<nav class="navbar navbar-default navbar-fixed-top">
    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
            </button>
        <a class="navbar-brand" href="">Website Builder</a>
    </div>
    <div>
        <div class="collapse navbar-collapse" id="myNavbar">
            <ul class="nav navbar-nav">
                <li>
                    <a href="#" @click.native="currentView='create'">Create</a>
                </li>
                <li>
                    <a href="#" @click.native="currentView='how'">How</a>
                </li>
                <li>
                    <a href="#" @click.native="currentView='about'">About</a>
                </li>
                <li>
                    <a href="#" @click.native="currentView='youtube'">Videos</a>
                </li>
            </ul>
        </div>
    </div>
</nav>
</template>

그리고 내 js:

Vue.component('navigation', Navigation)
Vue.component('create', Create)
Vue.component('how', How)
Vue.component('about', About)
Vue.component('youtube', Youtube)

new Vue({
    el: '#app',
    data: {
        currentView: 'create'
    }

및 html:

<div id="app">
    <navigation></navigation>
    <keep-alive>
        <transition name="slide-fade" mode="out-in">
            <component :is="currentView"></component>
        </transition>
    </keep-alive>
</div>

하지만 네비게이션을 클릭해도 변하지 않기 때문에 정상적으로 동작하고 있지 않다고 생각합니다만, 컴포넌트에서 네비게이션을 떼어놓고 divid=app에 꽂으면 정상적으로 동작합니다만, 왜 이런 일이 일어나는 것입니까?

1. 그.native수식자는 네이티브 요소에는 필요하지 않습니다. 구성 요소에만 사용할 수 있습니다.제거해 주세요.

2. 루트 구성 요소의 데이터를 변경하려는 것 같습니다.현재 코드는 탐색 구성요소의 데이터를 변경합니다.

이를 위한 두 가지 방법:

1) 깨끗한 방법:

네비게이션 컴포넌트에서는 부모에게 새로운 값을 가진 이벤트를 내보냅니다.

<a href="#" @click="$emit('current-view', 'youtube')">

부모(여기서는 루트) 컴포넌트에서 이벤트를 수신하고 값을 설정합니다.

<navigation @current-view="currentView = $event"></navigation>

2) 해킹 방법:

<a href="#" @click="$root.currentView='youtube'">

언급URL : https://stackoverflow.com/questions/47094620/vue-click-native-not-working