网站开发提问,织梦 电影网站 模板,成都做公司网站推广,在线网站流量查询element-ui组件输入框之放大镜(搜索图标 前言一、解决suffix-iconel-icon-search绑定事件问题 前言
在使用element-ui组件时想给输入框组件中的放大镜图标也就是搜索图标绑定事件#xff0c;可以进行如下操作#xff1a; 一、解决suffix-iconel-icon-sear… element-ui组件输入框之放大镜(搜索图标 前言一、解决suffix-iconel-icon-search绑定事件问题 前言
在使用element-ui组件时想给输入框组件中的放大镜图标也就是搜索图标绑定事件可以进行如下操作 一、解决suffix-iconel-icon-search绑定事件问题
suffix-icon“el-icon-search” 是一个 HTML 属性用于在 element-ui 中的 el-input 输入框添加后缀图标。其中 el-icon-search 是一个内置的图标类名表示搜索图标。 具体而言它会将在输入框的右侧显示一个小的搜索图标。例如 如何给这个图标绑定搜索功能搜索框输入内容后点击图标或者搜索完回车根据输入内容进行文件检索
templatedivel-input v-modelsearchText placeholder请输入内容 keyup.native.enterhandleSearchi slotsuffix classel-input__icon el-icon-search clickhandleSearch/i/el-input/div
/templatescript
export default {data() {return {searchText: ,};},methods: {handleSearch() {console.log(已发送搜索请求);// 在这里实现您的搜索逻辑},},
};
/script注意 以上代码中 ①keyup.native.enterhandleSearch保证输入框回车后可进行搜索。 ②i slot“suffix” class“el-input__icon el-icon-search” click“handleSearch” 保证点击搜索图标后可进行搜索。
