问题描述
在 initialze 操作中，我们传递一个对象，该对象告诉格式名称和初始值。但是它如何理解哪个值对应哪个 Field。
就像我在 redux 表单中有 5 个字段并且只想初始化 2 个字段。那么 initialze 操作将如何理解为哪个字段提供了初始值。
https://redux-form.com/8.2.2/docs/api/props.md/#-code-initialize-data-object-function-code-
解决方法
在 import React,{ Component } from 'react';
import './SeeDetail.css';
import * as microsoftTeams from "@microsoft/teams-js";
import i18n from '../../i18n';
import { getUrlVideo } from '../../apis/messageListApi';
import axios,{ AxiosResponse,AxiosRequestConfig } from "axios";
export default class SeeDetail extends Component {
constructor(props) {
super(props);
this.state = {
video: ""
}
}
async componentDidMount() {
microsoftTeams.initialize();
const video = this.getQueryVariable('video');
const authTokenRequest = {
url: window.location.origin + "/signin-simple-start",successCallback: (token) => {
this.setState({ video: video });
},failureCallback: (error) => {
// When the getAuthToken function returns a "resourceRequiresConsent" error,// it means Azure AD needs the user's consent before issuing a token to the app.
// The following code redirects the user to the "Sign in" page where the user can grant the consent.
// Right now,the app redirects to the consent page for any error.
microsoftTeams.authentication.authenticate({
url: window.location.origin + "/signin-simple-start",successCallback: () => {
console.log("Login succeeded!");
this.setState({ video: video });
},failureCallback: (reason) => {
console.log("Login failed: " + reason);
window.location.href = `/errorpage?locale=${i18n.language}`;
}
});
},resources: []
};
microsoftTeams.authentication.getAuthToken(authTokenRequest);
}
getQueryVariable(variable) {
var query = window.location.search.substring(1);
console.log(query)//"app=article&act=news_content&aid=160990"
var vars = query.split("&");
console.log(vars) //[ 'app=article','act=news_content','aid=160990' ]
for (var i = 0; i < vars.length; i++) {
var pair = vars[i].split("=");
console.log(pair)//[ 'app','article' ][ 'act','news_content' ][ 'aid','160990' ]
if (pair[0] == variable) { return pair[1]; }
}
return (false);
}
render() {
return (
<div className="container" >
<iframe id="my_iframe" src={this.state.video} className="responsive-iframe" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen="allowfullscreen"></iframe>
</div>
)
}
}
操作中，我们传递一个对象，该对象告诉表单名称
和初始值。它如何理解哪个值将是
对于initialze。
具有初始值的对象将（应该）具有与字段输入 Field 属性匹配的键。
示例：
name如果表单是用 <Field
autoComplete="email"
component={RenderTextField}
id="login-email"
label={formatMessage(strings.loginUsername)}
name="email"
type="text"
/>
初始化的，它会将 initialize('login',{ email: state.emailAddress }); 匹配/分配给具有匹配 state.emailAddress 属性的输入值，在这种情况下为 name。