学习笔记jira项目5-用jsx列表渲染开发下拉框组件

简介: 学习笔记jira项目5-用jsx列表渲染开发下拉框组件

image.png

const SearchPannel = ({ users, param, setParam }) =>
{
  return (
    <form>
      <div>
        <input type="text" value={param.name} onChange={evt => setParam({
          ...param,
          name: evt.target.value
        })} />
        <select value={param.personId} onChange={evt => setParam({
          ...param,
          personId: evt.target.value
        })}>
          <option value={''}>负责人</option>
          {
            users.map(user => <option key={user.id} value={user.id}>{user.name}</option>)
          }
        </select>
      </div>
    </form>
  )
}
export default SearchPannel
相关文章
|
9月前
|
JavaScript
【实用模板】Vue代码文件常用弹窗页面组件
【实用模板】Vue代码文件常用弹窗页面组件
|
9月前
|
JavaScript
Vue 项目中实现在所有页面固定一个全局对话栏组件
Vue 项目中实现在所有页面固定一个全局对话栏组件
83 0
|
前端开发 程序员 API
前端反卷计划-组件库-05-Menu组件开发
前端反卷计划-组件库-05-Menu组件开发
125 2
|
JavaScript
【Vue3从零开始-实战】S16:详情页样式优化及tab栏内容联动功能实现
【Vue3从零开始-实战】S16:详情页样式优化及tab栏内容联动功能实现
311 0
【Vue3从零开始-实战】S16:详情页样式优化及tab栏内容联动功能实现
|
6月前
|
前端开发
如何在前端项目中单独引入 ElementUI 图标以及使用
这篇文章介绍了如何在前端项目中单独引入Element UI的图标文件以及如何使用这些图标。
544 0
如何在前端项目中单独引入 ElementUI 图标以及使用
|
7月前
|
小程序 JavaScript 前端开发
【微信小程序-原生开发】实用教程06-轮播图、分类页签 tab 、成员列表(含Tdesign升级,切换调试基础库,设置全局样式,配置组件按需注入,添加图片素材,wx:for,生命周期 onLoad)
【微信小程序-原生开发】实用教程06-轮播图、分类页签 tab 、成员列表(含Tdesign升级,切换调试基础库,设置全局样式,配置组件按需注入,添加图片素材,wx:for,生命周期 onLoad)
218 0
|
8月前
|
开发工具 git
大事件项目12--侧边栏导航的组件标签准备
大事件项目12--侧边栏导航的组件标签准备
|
9月前
Vue3实现列表的拖拽切换
Vue3实现列表的拖拽切换
123 0
|
9月前
vue2列表拖拽操作
vue2列表拖拽操作
vue3的动态组件 component (点击顶部切换下面展示对应的组件内容)
vue3的动态组件 component (点击顶部切换下面展示对应的组件内容)
1070 0
vue3的动态组件 component (点击顶部切换下面展示对应的组件内容)

热门文章

最新文章