<input class="input" v-model="searchParam" :placeholder="placeholderText" @blur="handleBlur" />怎么写事件？

你可以这样写：

<input class="input" v-model="searchParam" :placeholder="placeholderText" @blur="handleBlur" />

<script>
export default {
  data() {
    return {
      searchParam: '',
      placeholderText: '请输入搜索内容'
    }
  },
  methods: {
    handleBlur() {
      console.log('失去焦点')
      // 在这里写失去焦点后的事件
    }
  }
}
</script>

在这个例子中，当输入框失去焦点时，`handleBlur`方法会被触发，你可以在这个方法里面写失去焦点后的逻辑代码。

相关问题

<div> <Row> <Col span={10}> <Form > <Form.Item > <Input allowClear placeholder="请输入车辆牌照回车检索" shape="round" value={searchParam} onChange={(e) => {setSearchParam(e.target.value);handleSearch(e.target.value)}} /> </Form.Item> </Form> </Col> </Row> </div> <div style={{ marginTop: "10px"}}> <Table rowKey={record => record.vehicleId} components={{ body: { row: EditableRow, cell: EditableCell, }, }} columns={newSelectColumns} dataSource={createBill} scroll={{ y: 600 }} /> </div> <div > <Button type="primary" shape="round" onClick={()=>{ onsubmit()}}>保存</Button> <Button type="primary" shape="round" onClick={()=>{onCancel()}}>返回</Button> </div>根据上述代码 如何让保存 返回按钮自动固定在底部 不同屏幕做到自适应

要实现保存和返回按钮自动固定在底部，并且在不同屏幕上实现自适应，你可以使用 Flex 布局和 CSS 样式来实现。以下是一种可能的实现方式：

1. 在外层包裹一个容器，设置容器的高度为 `100%`，并使用 Flex 布局，使其子元素垂直排列。同时，设置容器的 `position` 属性为 `relative`，以便让内部元素相对于容器进行定位。

2. 在保存和返回按钮所在的容器中，设置 `position` 属性为 `absolute`，并且设置 `bottom` 属性为 `0`，以使按钮固定在底部。

3. 使用 CSS 的媒体查询来根据不同屏幕尺寸应用不同的样式。你可以根据需要调整按钮的大小、间距和其他样式属性。

以下是示例代码，展示了如何应用上述步骤中的实现方式：

<div style={{ height: '100%', display: 'flex', flexDirection: 'column', position: 'relative' }}>
  <div style={{ flex: 1 }}>
    {/* 表单和表格部分 */}
    <div>
      <Row>
        <Col span={10}>
          <Form>
            <Form.Item>
              <Input allowClear placeholder="请输入车辆牌照回车检索" shape="round" value={searchParam} onChange={(e) => { setSearchParam(e.target.value); handleSearch(e.target.value) }} />
            </Form.Item>
          </Form>
        </Col>
      </Row>

      <div style={{ marginTop: "10px" }}>
        <Table
          rowKey={record => record.vehicleId}
          components={{
            body: {
              row: EditableRow,
              cell: EditableCell,
            },
          }}
          columns={newSelectColumns}
          dataSource={createBill}
          scroll={{ y: 600 }}
        />
      </div>
    </div>
  </div>

  {/* 保存和返回按钮部分 */}
  <div style={{ position: 'absolute', bottom: 0 }}>
    <Button type="primary" shape="round" onClick={() => { onsubmit() }}>保存</Button>
    <Button type="primary" shape="round" onClick={() => { onCancel() }}>返回</Button>
  </div>
</div>

通过使用以上代码，你可以实现保存和返回按钮自动固定在底部，并且在不同屏幕上实现自适应。你可以根据需要调整容器的样式和按钮的样式，以满足你的项目需求。

<select id="findList" resultType="ZdrgkBkyj" > SELECT <include refid="zdrgkBkyjColumns"/> FROM zdrgk_zdrgj a left join zdryk_bkgl b on a.zdrgj_xm = b.bkgl_zdrxm and b.del_flag = #{DEL_FLAG_NORMAL} <where> a.del_flag = #{DEL_FLAG_NORMAL} ${dataScope} <if test="zdrgjXm != null and zdrgjXm != ''"> AND a.zdrgj_xm = #{zdrgjXm} </if> <if test="zdrgjSfzhm != null and zdrgjSfzhm != ''"> AND a.zdrgj_sfzhm = #{zdrgjSfzhm} </if> <if test="zdrgjXsd != null and zdrgjXsd != ''"> AND a.zdrgj_xsd = #{zdrgjXsd} </if> <if test="bkglZdrxm != null and bkglZdrxm != ''"> AND b.bkgl_zdrxm = #{bkglZdrxm} </if> </where> <choose> <when test="page !=null and page.orderBy != null and page.orderBy != ''"> ORDER BY ${page.orderBy} </when> <otherwise> ORDER BY a.update_date DESC </otherwise> </choose> </select>为zdrgkbkyj的xml文件 bkglZdrxm只作为查询没有显示在列表数据中如何在jeeplus中 queryParams : function(params) { var searchParam = $("#searchForm").serializeJSON(); searchParam.zdrgjXm = $("#zdrgjXm").val(); searchParam.bkglZdrxm = $("#bkglZdrxm").val(); if (searchParam.zdrgjXm && searchParam.bkglZdrxm && searchParam.zdrgjXm === searchParam.bkglZdrxm) { searchParam.matchedValue = searchParam.zdrgjXm; } else { searchParam.matchedValue = null; } searchParam.pageNo = params.limit === undefined? "1" :params.offset/params.limit+1; searchParam.pageSize = params.limit === undefined? -1 : params.limit; if(params.sort && params.order){ searchParam.orderBy = params.sort+ " "+ params.order; } return searchParam; }中添加一个查询条件 当前的zdrgjXm字段要和bkglZdrxm字段有一样的值才能显示

你想要在Jeeplus中添加一个查询条件，使得只有当zdrgjXm字段与bkglZdrxm字段具有相同的值时，该记录才能被显示。那么你可以在queryParams函数中添加以下代码：

if (searchParam.zdrgjXm && searchParam.bkglZdrxm && searchParam.zdrgjXm === searchParam.bkglZdrxm) {
    searchParam.matchedValue = searchParam.zdrgjXm;
} else {
    searchParam.matchedValue = null;
}

这段代码会判断zdrgjXm和bkglZdrxm是否都有值，如果都有值且相同，则将matchedValue设为zdrgjXm的值，否则将matchedValue设为null。接着你可以在你的SQL语句中使用matchedValue来作为查询条件，例如：

<if test="matchedValue != null">
    AND (a.zdrgj_xm = #{matchedValue} OR b.bkgl_zdrxm = #{matchedValue})
</if>

这段代码将检查是否存在matchedValue，如果有，则将其作为查询条件，匹配a表中的zdrgj_xm或b表中的bkgl_zdrxm。这样一来，只有当zdrgjXm和bkglZdrxm的值相同时，才能匹配到该记录。