点击侧边栏菜单时需手动绑定element.on('nav(filter)')监听事件，提取data-search-key值，更新搜索参数并重置分页为1，再调用form.submit()或$.ajax触发搜索，同时调用element.tabchange()同步高亮状态。
点击侧边栏菜单时如何触发搜索？
核心是监听 layui.nav 或自定义菜单的点击事件，手动调用搜索逻辑（比如提交表单、触发 layui.form.on('submit(...)')、或调用 API 搜索函数）。Layui 本身不内置“侧边栏点击即搜索”行为，必须自己绑定事件并控制搜索动作。
常见错误是直接在 layui.use(['element', 'form'], ...) 中只初始化模块，却没给菜单项加 data-search="true" 或类似标识，导致无法区分哪些菜单项需要触发搜索。
- 侧边栏菜单项建议统一加
data-search-key属性，例如<li data-search-key="user">用户管理</li> - 用
element.on('nav(sideBarFilter)', ...)监听导航切换（前提是菜单容器有lay-filter="sideBarFilter"） - 在回调里取到
data-search-key值，再传给搜索函数，比如doSearch(key)
搜索逻辑该写在哪？form.submit 还是 $.ajax？
取决于搜索是否需要提交表单校验、是否复用已有搜索框。如果侧边栏点击即按固定关键词查（如“订单列表”点一下就查 status=1），用 $.ajax 更轻量；如果要走完整表单流程（含验证、分页重置、条件联动），应模拟表单提交。
容易踩的坑：在 element.on 回调里直接写 $('#searchForm').submit()，但没预先设置好隐藏域或 input 值，导致后端收不到搜索参数。
- 推荐方式：用
$('#searchKey').val(key)更新隐藏输入框，再触发form.on('submit(searchBtn)', ...)对应的 submit 监听 - 避免直接调
form.render()后立刻 submit——render 是异步的，可能来不及更新值 - 若不用表单，直接
$.get('/api/list', {q: key})即可，但注意分页参数（如page、limit）需一并带上
如何保持侧边栏高亮与搜索结果同步？
点击菜单后，既要执行搜索，又要确保当前菜单项被 element.tabChange 或 element.init() 正确高亮。Layui 的 element 模块默认只响应 click，不自动关联数据状态。
典型问题：点了“商品”菜单，搜索发出去了，但侧边栏高亮还停在“用户”上。
- 确保每个菜单
<li>有唯一lay-id，例如<li lay-id="goods"> - 搜索成功后调用
element.tabChange('sideBarFilter', 'goods')（注意 filter 名要一致） - 如果用了
router或 hash 路由，记得同步更新location.hash，否则刷新页面会丢失高亮
搜索时要不要清空分页？为什么总翻页后搜不到新数据？
绝大多数场景下，点击侧边栏意味着“换维度查”，必须重置当前页码为 1，否则会带着 page=3 去查新关键词，结果为空或错乱。
这个点极容易被忽略——开发者只改了搜索关键词，却忘了把 page 参数设回 1，导致接口返回空数组，前端误以为无数据。
- 在
doSearch(key)函数开头，显式重置分页变量：currentPage = 1，并更新分页组件：laypage.render({curr: 1, ...}) - 如果用的是
table.render，调用table.reload('id', {page: {curr: 1}}) - 后端接口也建议做兜底：当
q改变时，忽略原有page参数，强制从第 1 页开始
