vue中页面input输入的内容是一个js函数或表达式,如何让其生效?

作者站长头像
站长
· 阅读数 8

有一个需求,需要给不同的类目赋值动态的调用接口并处理它的返回值。比如说有个类目叫三年2班的所有学生,我需要给它绑定一个接口地址,接口调用方式,接口入参以及返回值的处理逻辑,并且把它存进数据库,下次用的时候直接调用,页面上是这样的:vue中页面input输入的内容是一个js函数或表达式,如何让其生效?正常情况下,的处理是

request(地址,get,入参).then(res=>{
     return res.data
})

但是由于需要页面传值,导致接口返值定义这里输入的是字符串,所以怎么可以让我输入的字符串达到表达式的效果呢vue中页面input输入的内容是一个js函数或表达式,如何让其生效?这个要怎么解决呢

回复
1个回答
avatar
test
2024-06-30

emmm……来了一个不怕死的。你可以考虑用 eval() - JavaScript | MDN

但是最重要的一句我还是要说一下:

永远不要信任用户的输入


Edit

想了想,还是给一个比较靠谱的建议把,你可以让用户选择使用哪一个属性值,而不是一段可执行的JS。比如说你现在需求中的 res.data 中的 data。那么让用户键入 data 就行了,然后你返回的时候 return res[userValueKey] 这样处理就可以了

// 举例获取用户输入的 userValueKey
const userValueKey = 'data'
// 请求接口
request(apiUrl, 'get', {...params}).then(res=>{
   return res[userValueKey]
})

如果用户端输入的正确,那么自然有正确的返回值,如果不合规自然不会有返回值。这样实现的结果和你的需求的业务逻辑其实时一样的。

最多再增加一些兜底,比如说增加一个是否会 undefinded 的判断,如果没有找到,则提示用户维护的接口返回属性值错误

回复
likes
适合作为回答的
  • 经过验证的有效解决办法
  • 自己的经验指引,对解决问题有帮助
  • 遵循 Markdown 语法排版,代码语义正确
不该作为回答的
  • 询问内容细节或回复楼层
  • 与题目无关的内容
  • “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容