2016-11-27 3 views
2

В настоящее время я работаю над проектом в Vue.js, и это мой первый опыт работы с полной средой, использующей Webpack, Vue.js, Babel и т. Д.Панель навигации с Vue.js

В предыдущих проектах наличие навигационной панели было довольно прямым. Просто добавьте структуру HTML, скопируйте ссылки и все, панель навигации будет выполнена. Теперь с Vue.js, я думаю, что это разрушит смысл компонентов. Я добавил <nav-bar> -компонент и несколько <nav-bar-item> -компонентов. Это хорошо работает, появляется панель навигации и содержит элементы.

Теперь о фактической проблеме: Где я теперь размещаю свои ссылки и тексты для этих предметов? Мое предположение заключалось в том, чтобы поместить их внутри компонента <nav-bar>, но текст визуализируется компонентом <nav-bar-item>, поэтому мне придется передать данные. Помещение их непосредственно внутри компонента <nav-bar-item> не будет работать, потому что элемент «не знает», что находится на общем сайте.

Что было бы лучше всего здесь? Передайте данные? Создать глобальную конфигурацию?

Спасибо!

+0

Вы здание SPA или несколько приложение? –

+0

Я создаю многостраничное приложение, но я использую vue-router для этого. Таким образом, в основном это SPA, но он отображает много разных взглядов. – NikxDa

+0

И эти представления в основном являются компонентами Vue, и вы прикрепляли их для сопоставления пути в настройках маршрутизатора? –

ответ

1

Вещь, которую Вы можете сделать, это определить исходные данные в родительском компоненте, который будет хранить информацию о навигационном баре items.Then вы можете перебирать их и передавать данные для каждого элемента с помощью реквизита https://vuejs.org/v2/guide/components.html#Props

Смежные вопросы