设计页面时希望效果：左侧侧边导航栏，右侧内容。点击左侧导航栏的不同块，右侧显示不同内容。
采用了vant组件中侧边导航栏van-sidebar，van-sidebar子标签包括多个van-sidebar-item
实现方法：
van-sidebar中设置 bind:change="onChange"：
<van-sidebar active-key="{{ activeKey }}" bind:change="onChange"><van-sidebar-item title="农家水果" custom-class="cellTab" /><van-sidebar-item title="农家蔬菜" custom-class="cellTab"/><van-sidebar-item title="自种茶叶" custom-class="cellTab"/><van-sidebar-item title="加工零食" custom-class="cellTab"/><van-sidebar-item title="加工饮料" custom-class="cellTab"/><van-sidebar-item title="加工调料" custom-class="cellTab"/></van-sidebar>
随后在js文件中编写onChange（event），其中event.detail即对应导航栏块的索引。以event.detail作switch参数，在case中通过this.setData设置右侧区域内容。
onChange(event) {switch(event.detail){case 0:this.setData({goods:[{price:"5.6元/斤",tag:"热销",title:"农家大橘子",image:"../myImage/orange.webp",value:"5"},{price:"6.6元/斤",tag:"新品",title:"农家大香蕉",image:"../myImage/banana.webp",value:"4"}]});break;case 1:this.setData({goods:[{price:"5.6元/斤",tag:"热销",title:"农家白菜",image:"../myImage/vegetable.webp",value:"5"},{price:"6.6元/斤",tag:"新品",title:"农家西红柿",image:"../myImage/tomato.webp",value:"4"}]})}}
即可实现跳转效果
