美文网首页
useEventTarget

useEventTarget

作者: skoll | 来源:发表于2022-02-24 16:35 被阅读0次

    简介

    1 .封装创建的表单值,支持自定义值转换和重置
    2 .不用自己写onChange函数,直接绑定到onChange上面就行
    3 .注意要做结构,不然只能做一个值的操作

    import React from 'react'
    import {useEventTarget} from 'ahooks'
    export default function Drag(props){
        let [inputValue,{reset:inputReset,onChange:onInputChange}]=useEventTarget({initialValue:props.name})
    
        let [selectValue,{reset:selectReset,onChange:selectChange}]=useEventTarget({initialValue:"1"})
    
        return (
            <div>
                <input onChange={onInputChange} value={inputValue}></input>
                {inputValue}
                <button onClick={inputReset}>重置</button>
    
                <select value={selectValue} onChange={selectChange}>
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                    <option value="4">4</option>
                </select> 
                <button onClick={selectReset}>重置</button>
            </div>
        )
    }
    

    相关文章

      网友评论

          本文标题:useEventTarget

          本文链接:https://www.haomeiwen.com/subject/dqvzlrtx.html