<template>
<div>
<van-nav-bar
title="导航栏标题"
left-text="返回"
@click-left="onClickLeft"
right-text="按钮"
@click-right="onClickRight"
/>
<!-- 这里放页面的其他内容 -->
</div>
</template>
<script>
export default {
methods: {
onClickLeft() {
// 处理左侧按钮点击事件，通常用于返回上一页
console.log('点击了返回按钮');
},
onClickRight() {
// 处理右侧按钮点击事件
console.log('点击了右侧按钮');
},
},
};
</script>
在这个示例中，<van-nav-bar> 组件用于创建导航栏，通过属性设置标题、左侧按钮文字、右侧按钮文字等。通过 @click-left 和 @click-right 事件监听左侧按钮和右侧按钮的点击事件，然后在对应的方法中处理点击事件的逻辑。
确保已正确安装和引入 Vant，以及按照文档进行配置。
转载请注明出处：http://www.pingtaimeng.com/article/detail/5696/Vant