Pioneer丶 2022-02-15 11:30 采纳率: 40%
浏览 288
已结题

vue3,ref响应式数据无法使用js原生filter函数问题?

问题遇到的现象和发生背景

如题!

问题相关代码,请勿粘贴截图
<div v-for="course in courses" class="col-md-3">
  <div v-for="teacher in teachers.filter(t=>{return t.id===course.teacherId})" class="profile-activity clearfix">
          <div>
                <img v-show="!teacher.image" class="pull-left"  src="/assets/images/avatars/avatar5.png">
                 <img v-show="teacher.image" class="pull-left" v-bind:src="teacher.image">
                   <a class="user" href="#"> {{teacher.name || '暂无名称'}} </a>
                   <br>
                   {{teacher.position || '暂无职位'}}
             </div>
      </div>
</div>

<script>
setup() {
  const courses = ref();
  let teachers=ref();

const allCourse = () => {
                axios.get("/course/all").then((response) => {
                    const data=response.data;
                    if (data.success){
                        courses .value = data.content;
                    }else {
                        Toast.warning(data.message);
                    }

                })
            };

const allTeacher = () => {
                axios.get("/teacher/all").then((response) => {
                    const data=response.data;
                    if (data.success){
                        teachers.value = data.content;
                    }else {
                        Toast.warning(data.message);
                    }

                })
            };

onMounted(() => {
                allCourse();
                allTeacher();
            });

  return{
    courses,
    teachers
  }
</script>


运行结果及报错内容

img

我想要达到的结果

从teachers数组中过滤出符合条件的teacher对象放在页面中。

  • 写回答

2条回答 默认 最新

查看更多回答(1条)

报告相同问题?

问题事件

  • 系统已结题 2月23日
  • 已采纳回答 2月15日
  • 修改了问题 2月15日
  • 修改了问题 2月15日
  • 展开全部

悬赏问题

  • ¥15 win32如何自绘编辑框的背景图片(语言-c++|操作系统-windows)
  • ¥15 微信夜间被转走了1w对,当天手机剪切板里就出现了这个乱码,有铁子可以看看是啥吗可以
  • ¥50 跑通github上的代码 深度学习 pytorch
  • ¥50 求写,批处理调用分区助手分区脚本
  • ¥15 求购HI3519AV100开发板
  • ¥15 请问1553 RT怎么测试,没有BC有方法吗
  • ¥100 业务编程如何选择学习方向和内容?
  • ¥15 wamp3.3.5安装完成后图标正常显示绿色,鼠标左右键点击图标均无反应。求解决方法。
  • ¥15 鼠标点击的这条记录了什么?
  • ¥15 在写pid调速的程序时,电机始终维持最大速度