小程序 input输入取消按钮显示，否则取消按钮隐藏

最新推荐文章于 2021-12-12 11:53:41 发布

xiao-_yuanyuan-20

最新推荐文章于 2021-12-12 11:53:41 发布

阅读量600

点赞数

文章标签：小程序 javascript 前端

本文链接：https://blog.csdn.net/xiao_yuanyuan_20/article/details/116951466

版权

本文介绍了一个小程序的实现细节，当input输入框内无文字时，取消按钮会隐藏；一旦输入文字，取消按钮则显示。重点强调了在WXML文件中引用JS数据时需使用双大括号{{}}包裹。

摘要由CSDN通过智能技术生成

4，demo，如果input没有文字的时候，后面的“取消”按钮，隐藏；如果在input框中输入文字，后面的“取消”按钮，显示；

（易错点：在index.wxml文件中，使用index.js中data中的值都需要{ {}} ）

第一步：在index.js文件中，
		data：{
   searchWords:'';//搜索的关键字}
第二步：在index.wxml文件中，input双向绑定 data中的关键字    
<input model:value="{
   {searchWords}}" placeholder="请输入您要搜索的商品" type