带 Vue.js 的导航栏
Navigation Bar with Vue.js
我目前正在 Vue.js 中从事一个项目，这是我第一次使用 Webpack、Vue.js、Babel 等在完整环境中工作。
在以前的项目中，导航栏非常简单。只需添加 HTML 结构，对链接进行硬编码，就这样，导航栏就完成了。现在有了Vue.js，我认为这会破坏组件的感觉。我添加了一个 <nav-bar>-组件和几个 <nav-bar-item>-组件。这很好用，导航栏出现并包含项目。
现在进入实际问题：我现在应该将这些项目的链接和文本放在哪里？我的猜测是将它们放在 <nav-bar>-component 中，但是文本是由 <nav-bar-item>-component 渲染的，所以我不得不交出数据。将它们直接放在 <nav-bar-item>-component 中是行不通的，因为该项目 "not know" 它在整个站点中的作用。
这里的最佳做法是什么？交出资料？创建全局配置？
谢谢！
您可以做的是在父组件中定义初始数据，这将存储有关导航栏的信息 items.Then 您可以迭代它们并使用道具 https://vuejs.org/v2/guide/components.html#Props[= 为每个项目发送数据11=]
我目前正在 Vue.js 中从事一个项目，这是我第一次使用 Webpack、Vue.js、Babel 等在完整环境中工作。
在以前的项目中，导航栏非常简单。只需添加 HTML 结构，对链接进行硬编码，就这样，导航栏就完成了。现在有了Vue.js，我认为这会破坏组件的感觉。我添加了一个 <nav-bar>-组件和几个 <nav-bar-item>-组件。这很好用，导航栏出现并包含项目。
现在进入实际问题：我现在应该将这些项目的链接和文本放在哪里？我的猜测是将它们放在 <nav-bar>-component 中，但是文本是由 <nav-bar-item>-component 渲染的，所以我不得不交出数据。将它们直接放在 <nav-bar-item>-component 中是行不通的，因为该项目 "not know" 它在整个站点中的作用。
这里的最佳做法是什么？交出资料？创建全局配置？
谢谢！
您可以做的是在父组件中定义初始数据，这将存储有关导航栏的信息 items.Then 您可以迭代它们并使用道具 https://vuejs.org/v2/guide/components.html#Props[= 为每个项目发送数据11=]