marlsun 2022-07-03 09:19 采纳率: 84.2%
浏览 33
已结题

input输入字符与后台数据源的查询匹配


<template>
  <div>
    <el-row :gutter="20" class="header">
      <el-input
        v-model="inputChr"
        clearable
        placeholder="请输入姓名"
      />
      <el-button type="primary" @click="initInput">查询</el-button>
    </el-row>
  </div>
</template>
<script setup>
// 问题:根据用户输入的字符与服务器数据源的某字段值匹配与否,判断程序是否需要执行

//以下是

//从本地存储中读取用户输入的单字数据
const inputChr = ref(JSON.parse(localStorage.getItem("chr")) || "");
//监测输入的变化
watch(
  inputChr,
  (newValue) => {
    localStorage.setItem("chr", JSON.stringify(newValue));
  },
  { deep: true, immediate: true }
);

//假定后台传过来的数组格式如下:
const arr = [
  { name: "Tom", grade: "A", value: 1 },
  { name: "Jack", grade: "E", value: 2 },
  { name: "Mike", grade: "C", value: 3 },
  { name: "John", grade: "D", value: 4 },
  { name: "Ben", grade: "E", value: 2 },
  { name: "Tony", grade: "D", value: 4 },
  { name: "Marry", grade: "D", value: 4 },
  { name: "Peter", grade: "E", value: 5 },
];

//需要判断:如果inputChr与arr.name的值相符,则继续下面的程序;如果inputChr与arr.name的值不相符,则弹框报错并退出程序
//....
const initInput = () => {
    /* ...... */
}
</script>
<style></style>


展开全部

  • 写回答

3条回答 默认 最新

查看更多回答(2条)
编辑
预览

报告相同问题?

问题事件

  • 已结题 (查看结题原因) 7月4日
  • 已采纳回答 7月3日
  • 创建了问题 7月3日

悬赏问题

  • ¥15 利用3支股票数据估计其均值和方差的95%置信区间。
  • ¥15 微信小程序运行一项功能时,弹出未知错误弹框,检查代码没有问题
  • ¥15 ATAC测序生成self-pseudo replicates之前是否要进行去线粒体reads
  • ¥15 python模糊字匹配函数问题
  • ¥20 谁刷目标页面的uv记录器上数据,数据只记录跳转的数值
  • ¥30 数据库软件的安装方法
  • ¥15 一道以太网数据传输题
  • ¥15 python 下载群辉文件
  • ¥50 代码还没怎么运行但是需要代码功能调用数据
  • ¥15 vue请求不到数据,返回状态200,数据为html