2021-05-29关于mvvm的数据驱动概念举例理解

场景：点击菜单切换内容
事件驱动：在菜单的tab上面添加click事件控制内容的显示和隐藏，达到点击不同tab切换不同内容的目的。
数据驱动：以vue为例

<van-tabs v-model="activeName">
  <van-tab title="标签 1" name="a">内容 1</van-tab>
  <van-tab title="标签 2" name="b">内容 2</van-tab>
  <van-tab title="标签 3" name="c">内容 3</van-tab>
</van-tabs>
<button @click="change"/>
export default {
  data() {
    return {
      activeName: 'a',
    };
  },
};
//改变activeName的值
method:{
change(){
  this.activeName=b
 }
}

点击按钮改变数据activeName的值，便切换到了内容b。