• 智能AI问答!更聪明、更完整、原创作!
  • 一款基于GPT的超级AI机器人,可以回答问题、聊天、创作、写文案!

<img src="/static/img/0.png" draggable="false"> vue 给以上代码增加根据星期选择图片,如周一为1.png,周二为2.png,周三为3.png,以此类推

发布于 2023-09-17 03:29:59

要根据星期选择不同的图片,你可以使用一个computed属性来获取当前的星期,并根据星期返回对应的图片路径。首先,在Vue组件的data选项中定义一个对象,用来存储星期与图片路径的映射关系:

data() {
  return {
    weekImages: {
      1: '1.png',
      2: '2.png',
      3: '3.png',
      4: '4.png',
      5: '5.png',
      6: '6.png',
      7: '7.png'
    }
  }
}

然后,在computed属性中添加一个方法,根据当前的星期返回对应的图片路径:

computed: {
  currentWeekImage() {
    const date = new Date();
    const week = date.getDay(); // 获取当前星期,1为周日,2为周一,以此类推
    return this.weekImages[week];
  }
}

最后,在模板中使用这个computed属性获取到的图片路径来显示图片:

<img :src="currentWeekImage" draggable="false">

这样,就能够根据当前的星期选择不同的图片了。

0 条评论

发布
问题

在线
客服