【问题标题】:Vue Native Router gives error not being usedVue Native Router 给出错误未使用
【发布时间】:2020-05-30 03:49:32
【问题描述】:

所以我正在为一个学校项目创建一个应用程序,并且我正在尝试制作一个导航屏幕。 我有一个带有 2 个按钮的屏幕,我正在努力让它们工作。如果我单击/按下按钮,我想转到不同的屏幕。 我是新手,这是我第一次使用 Vue Native。

当前代码:

<template>
  <div id="app">
    <HelloWorld msg="CarnavalXL"/>
    <div id="nav">
      <button @press="goToParadeScreen" class="nav-button">Optochten</button>
      <button href="screens/Parades.vue" class="nav-button" title="Niews">Nieuws</button>
      <router-link to="Parades" class="nav-button">Parades</router-link>
    </div>
  </div>
</template>

<script>
import HelloWorld from './components/HelloWorld.vue'

export default {
  name: 'CarnavalXL',
  components: {
    HelloWorld,
    AppNavigator
  },
  props: {
    navigation: {
      type: Object
    }
  },
  methods: {
    goToPAradeScreen() {
      this.navigation.navigate("Parades");
    }
  }

}
import {
  createAppContainer,
  createStackNavigator,
} from "vue-native-router";
import Parades from "./Parades.vue";
this.navigation.navigate("Parades", {/* options go here */});
const StackNavigator = createStackNavigator(
  {
    Parades: Parades,
  },
  {
    initialRouteName: 'Parades',
  }
);
const AppNavigator = createAppContainer(StackNavigator);

</script>

<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
  margin-left: 25vw;
  margin-right: 25vw;
}
.nav-button {
background-color: rgba(0, 0, 0, 0.3);
padding: 100px 0px;
width: 20vw;
display: inline-block;
margin: 5px;
color: #fff;
font-size: 40px;
font-weight: 800;
}
</style>

我收到以下错误:

Failed to compile.

./src/App.vue
Module Error (from ./node_modules/eslint-loader/index.js):

D:\carnavalxl\src\App.vue
  19:5  error  The "AppNavigator" component has been registered but not used  vue/no-unused-components

✖ 1 problem (1 error, 0 warnings)

我按照Vue Native网站上的指南进行操作

我不知道这里出了什么问题

【问题讨论】:

    标签: html vue-component vue-router


    【解决方案1】:

    这是因为你只导入了 HelloWord 组件,没有导入 AppNavigator 组件。如果您有一个名为 AppNavigator 的组件,您必须像 HelleWorld 一样导入它,如下所示:

    从'./components/HelloWorld.vue'导入HelloWorld

    【讨论】:

      猜你喜欢
      • 2019-09-22
      • 2021-03-15
      • 2021-04-21
      • 2017-05-27
      • 2022-12-15
      • 2019-07-16
      • 2020-07-01
      • 2020-04-17
      • 1970-01-01
      相关资源
      最近更新 更多