如何做网站预览,口碑营销推广,阿里云搭建企业网站,在阿里巴巴做网站多少钱uni-app 是一个使用 Vue.js 开发所有前端应用的框架#xff0c;开发者编写一次代码#xff0c;可发布到iOS、Android、H5、以及各种小程序等多个平台。 在 uni-app 中#xff0c;路由器是用于进行页面跳转和传参的重要工具。然而#xff0c;由于 uni-app 的跨平台特性…uni-app 是一个使用 Vue.js 开发所有前端应用的框架开发者编写一次代码可发布到iOS、Android、H5、以及各种小程序等多个平台。 在 uni-app 中路由器是用于进行页面跳转和传参的重要工具。然而由于 uni-app 的跨平台特性它使用的不是 vue-router 的语法。在 uni-app 中路由的用法是使用 uni.navigateTo方法例如uni.navigateTo({url:../login/login?id12345})。
以下是一个简单的 uni-app router 使用的例子
在页面中定义导航条目
template view text clicktoPage1Page 1/text text clicktoPage2Page 2/text /view
/template
script
export default { methods: { toPage1() { uni.navigateTo({ url: ../page1/page1 }); }, toPage2() { uni.navigateTo({ url: ../page2/page2 }); } }
};
/script
在 pages.json中配置路由
{ pages: [ { path: pages/index/index, style: { navigationBarTitleText: 首页 } }, { path: pages/page1/page1, style: { navigationBarTitleText: 页面 1 } }, { path: pages/page2/page2, style: { navigationBarTitleText: 页面 2 } } ], globalStyle: { tabBar: { list: [ { pagePath: pages/index/index, text: 首页, iconPath: /static/tabbar/home.png, selectedIconPath: /static/tabbar/home-active.png }, { pagePath: pages/page1/page1, text: 页面 1, iconPath: /static/tabbar/menu.png, selectedIconPath: /static/tabbar/menu-active.png }, { pagePath: pages/page2/page2, text: 页面 2, iconPath: /static/tabbar/search.png, selectedIconPath: /static/tabbar/search-active.png } ] } }
}
