Javascript 小部件的预填充字段

我必须在我的网站上使用小部件。我无法访问小部件源代码（缩小、模糊）。小部件使用我的DOM插入一些div，而不是frame。小部件可能是用react（在某些div上加前缀）构建的

用例：用户输入widget表单，单击“发送”并获得一些反馈。为了改善用户体验，我想预先填充这些字段

据widgets公司称，没有办法做到这一点。
我没有反应方面的经验

到目前为止我所尝试的：

在DOM就绪->部分工作后设置输入值。字段是预先填充的，但如果我尝试更改其中一个字段，值将消失。我认为，值存储在其他地方，只复制到输入

尝试在值更改->无结果后手动触发输入事件（更改、焦点、键控）以初始化小部件脚本

尝试模拟按键事件->运行到浏览器安全性

还有什么我能做的吗

Redux表单是react的组件，它允许从 表单并初始化redux表单的初始值，如下所示 示例的初始值为redux form，因此字段将 当您想要预填充全部或全部时，将该值作为初始值 将部分数据转换为表单。还要注意，初始状态也可以是 空的

let InitializeFromStateForm=props=>{
const{handleSubmit，load，pristine，reset，submiting}=props
返回(
//您的组件
)
}
//用reduxForm（）装饰。它将读取connect（）提供的initialValues属性
InitializeFromStateForm=reduxForm({
表单：“initializeFromState”//此表单的唯一标识符
})（InitializeFromStateForm）
//您必须将（）连接到您希望连接到自己的任何减速器
InitializeFromStateForm=连接(
状态=>({
initialValues:state.account.data//从account reducer中提取初始值
}),
{load:loadAccount}//绑定帐户加载操作创建者
)（InitializeFromStateForm）
导出默认的初始值FromStateform

---

请查找完整的文档示例

当涉及到更改输入值时，React做了一些技巧，因为它覆盖了

输入

元素的

值

的默认getter/setter，并且它有自己的值跟踪器。要使更改在React中得到处理，您需要使用本机

value

setter为输入提供新值，然后分派输入事件：

const App=（）=>console.log（`input event handled in React with value:${value}`）}/>
render（，document.getElementById（“根”））；
document.getElementById（“分派假事件”）.addEventListener（“单击”，（）=>{
const inputEl=document.getElementById（“输入”）；
Object.getOwnPropertyDescriptor（HTMLInputElement.prototype，“value”）.set.call(
输入，
“新价值”
);
const event=新事件（“输入”{
泡泡：是的，
可取消：false
});
Input.dispatchEvent（事件）；
})

分派假事件

表单初始化可能在小部件代码中的某个地方完成。如何在不访问任何变量名称的情况下更改值？您可以从任何位置更改全局状态，并从全局状态“输入”事件指定初始状态！非常感谢。

let InitializeFromStateForm = props => {
  const { handleSubmit, load, pristine, reset, submitting } = props
  return (
    <form onSubmit={handleSubmit}>
      <div>
       // your components
      </div>
    </form>
  )
}

// Decorate with reduxForm(). It will read the initialValues prop provided by connect()
InitializeFromStateForm = reduxForm({
  form: 'initializeFromState' // a unique identifier for this form
})(InitializeFromStateForm)

// You have to connect() to any reducers that you wish to connect to yourself
InitializeFromStateForm = connect(
  state => ({
    initialValues: state.account.data // pull initial values from account reducer
  }),
  { load: loadAccount } // bind account loading action creator
)(InitializeFromStateForm)

export default InitializeFromStateForm