1 Star 2 Fork 0

shenfei / Search-DialogJS

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
贡献代码
同步代码
取消
提示: 由于 Git 不支持空文件夾,创建文件夹后会生成空的 .keep 文件
Loading...
README
MIT

search_dialogJS

自带数据过滤的搜索框,对不同单个字符搜索且关键字变色

Show

Usage

将pages下index文件夹,拷贝到自己项目中并修改文件名字,然后通过import导入js即可使用了 1,给js中的originalList按照对应的数据结构赋值对应数据 2,根据对应的需要,按照如下赋值:

 //普通列表搜索框
    showDialog1(e) {
        this.isShowIcon = false
        this.loadingStyle ='loading'
        this.isShowLoading = false
        this.initData()
        this.$element('dialog').show()
    }
//Logo列表搜索框
    showDialog2(e) {
        this.isShowIcon = true;
        this.loadingStyle ='loading'
        this.isShowLoading = false
        this.initData()
        this.$element('dialog').show()
    }
 //网络加载搜索框
    showDialog3(e) {
        this.isShowIcon = true;
        this.isShowLoading = true
        this.initData()
        this.$element('dialog').show()
    }
//网络数据需要特别处理,就是在
 //数据处理
    onDataHandle() { 
        ……
          if (this.isShowLoading) {
           this.loadingStyle ='loadingShow' //请求前
          //这里可以做网络请求,拿到数据后
          that.loadingStyle ='loading'  //请求完成后
          //先给this.originalList = … 赋值,然后在调用一次初始化数据调用这个方法:this.initData(),
          //最后再调用  that.filterData()方法后,就完成了过滤并显示出列表了了
     }
  }    

由此便可完成使用,详情请看index.js的code

问题

1,我在模拟器上测试一切正常,但是在测试手机(2.0.0 Developer Beta3)版本上,在search组件搜索框在输入字符后,右边会出现一个“x”清除按钮, 在需要清除所有字符的时候,在模拟器上点击后,search组件onchange事件是正常响应的,但是在测试手机上,onchange事件没有出现任何响应,导致数据无法还原到初始化状态,列表状态没法还原。 2,在输入框字符后,在模拟器上能正常过滤,且style也正常,但是在测试手机上,过滤数据出现混乱,过滤数据偶现错误。 多次试验发现是list列表刷新的bug,显示错误后,点击item拿到的是正确的数据,但是不是正确的显示。由此推断。 3,对于重叠词输入,只会匹配到最先靠前的字符会变色,后面的字符不会变色。 4,被输入法覆盖几次后,list列表就显示不全了。

MIT License Copyright (c) 2021 FeiShen98 Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

简介

JS搜索框,快速过滤出关键字,且被搜索到的关键字变色 展开 收起
JavaScript
MIT
取消

发行版

暂无发行版

贡献者

全部

近期动态

加载更多
不能加载更多了
JavaScript
1
https://gitee.com/feishen98/search-dialog-js.git
git@gitee.com:feishen98/search-dialog-js.git
feishen98
search-dialog-js
Search-DialogJS
master

搜索帮助