Question

我想从表单输入字段向Redux存储发送值。该值应该是商店中对象的键值对。我卡住的唯一地方是如何针对此对象本身。点表示法不起作用。抱歉，我是Redux的新手。我的代码是：

 <input className="form-control mb-3" style={{ background: "white" }} 
  placeholder="Name" name="childsName" value={this.props.childName} 
  onChange={this.props.getChildName} type="text" />



  export const getChildName = (e) => dispatch => {
   dispatch({
     type: GET_CHILD_NAME,
    payload: e.target.value
   })
 }

case GET_CHILD_NAME:
  return {
    ...state,
    childInformation: action.payload
  };

const initialState = {
  childInformation: {
  checked: [],
  childName: "",
  childSurname: "",
  birthDate: ""
  }

};

我想将值添加到childInformation对象的childName属性

Answer 1

您可以使用传播语法覆盖状态中的嵌套值并返回新对象：


<!--- FUNCTION UDF: build SQL params --->

<!--- 

Notes:
Use for building sql with simple read queries: 

Supported:

- INNER JOINS
- value paramaterization
- IN operator with or without paramaterization
- ignore WHERE clause item, if a certain value or a value in a list of values, is matched: {...'ignore'='value'}
- ignore value list custom delimeter: default {...'ignoredelimiter'=','}
- use {...'sqltype'='number|string'} for non value paramaterization 
- positional paramaters 'table column ?'

Unsupported:

- subqueries
- named parameters, 'table column = :table column', due to a bug with the way Railo parses table prefixed columns sql

--->

<cffunction name="BuildSQLParams" access="public" returntype="string" hint="function description: build SQL params">
  <cfargument name="query" required="false" default="#StructNew()#" type="struct" hint="argument description: query">
  <cfargument name="params" required="false" default="#ArrayNew(1)#" type="array" hint="argument description: params">
  <cfset var result =  "">
  <cfset var local = StructNew()>
  <cfset local.keylist = "column,operator,sqltype,value">
  <cfset local.sqlarray = ArrayNew(1)>
  <cfif IsStruct(arguments.query) AND ArrayLen(arguments.params)>
    <cfloop from="1" to="#ArrayLen(arguments.params)#" index="local.i">
      <cfset local.param = arguments.params[local.i]>
      <cfif IsStruct(local.param) AND NOT StructIsEmpty(local.param)>
        <cfset local.isValidParam = false>
        <cfset local.counter = 0>
        <cfloop collection="#local.param#" item="local.key">
          <cfif ListFindNoCase(local.keylist,local.key)>
            <cfset local.counter = local.counter + 1>
          </cfif>
        </cfloop>
        <cfif local.counter EQ ListLen(local.keylist)>
        <cfset local.isValidParam = true>
        </cfif>
        <cfif local.isValidParam>
        <cfset local.ignore = false>
        <cfset local.ignoredelimiter = ",">
          <cfif StructKeyExists(param,'ignoredelimiter')>
            <cfset local.ignoredelimiter = param['ignoredelimiter']>
          </cfif>
          <cfif StructKeyExists(param,'ignore')>
            <cfif ListLen(param['ignore'],local.ignoredelimiter)>
              <cfif ListFindNoCase(param['ignore'],param['value'],local.ignoredelimiter)>
                <cfset local.ignore = true>
              </cfif>
            <cfelse>
              <cfif param['ignore'] EQ param['value']>
                <cfset local.ignore = true>
              </cfif>
            </cfif>
          </cfif>
          <cfif NOT local.ignore>
          <cfif NOT ListFindNoCase("number,string",param['sqltype'])>
              <cfif param['operator'] EQ "IN">
                <cfset arguments.query.addParam(value=param['value'],cfsqltype="cf_sql_#param['sqltype']#",list="yes")>
              <cfelse>
                <cfset arguments.query.addParam(value=param['value'],cfsqltype="cf_sql_#param['sqltype']#")>
              </cfif>
            </cfif>
          </cfif>
          <cfif NOT local.ignore>
            <cfsavecontent variable="local.sql">
              <cfoutput>
                #param['column']# 
                #param['operator']# 
                <cfif ListFindNoCase("number,string",param['sqltype'])>
                  <cfif param['sqltype'] EQ "number">
                    #param['value']# 
                  <cfelse>
                    '#param['value']#' 
                  </cfif>
                <cfelse>
                <cfif param['operator'] EQ "IN">
                    (?) 
                  <cfelse>
                    ?
                  </cfif>
                </cfif>
                <cfif StructKeyExists(param,'andOr')>
                  #param['andOr']# 
                </cfif>
              </cfoutput>
            </cfsavecontent>
            <cfset result = result & local.sql>
          </cfif>
        </cfif>
      </cfif>
    </cfloop>
  </cfif>     
  <cfif Len(Trim(result))>
  <cfset result = REReplaceNoCase(result,"[\s]+"," ","ALL")>
    <cfset result = REReplaceNoCase(result,"[\s]+(AND|OR|,)[\s]*$","","ALL")>
    <cfset result = Trim(result)>
  </cfif>
<cfreturn result /> 
</cffunction>


<!--- FUNCTION UDF: read query --->

<!--- 

Notes:
Use for executing sql with simple read queries: 

Supported:

- query attributes: datasource

Unsupported:

- apart from 'datasource', no other query attributes are supported

--->

<cffunction name="ReadQuery" returntype="struct" output="false" access="public" hint="function description: read query">
  <!--- arguments --->
  <cfargument name="dsn" required="yes" hint="argument description: dsn">
  <cfargument name="columns" type="string" required="no" default="" hint="argument description: columns">
  <cfargument name="tables" type="string" required="no" default="" hint="argument description: tables">
  <cfargument name="params" required="false" default="#ArrayNew(1)#" type="array" hint="argument description: params">
  <cfargument name="groupby" type="string" required="no" default="" hint="argument description: group by">
  <cfargument name="orderby" type="string" required="no" default="" hint="argument description: order by">
  <cfargument name="sortorder" type="string" required="no" default="ASC" hint="argument description: sort order">
  <!--- local variables --->
  <cfset var result = StructNew()>
  <cfset var local = StructNew()>
  <!--- logic --->
  <cfset StructInsert(result,"query",QueryNew(''))>
  <cfset StructInsert(result,"metaInfo",StructNew())>
  <cfif Len(Trim(arguments.tables))>
  <cfset local.wheresql = "">
    <cfset local.groupby = "">
    <cfset local.orderby = "">
    <cfif Len(Trim(arguments.groupby))>
      <cfset local.groupby = " GROUP BY " & arguments.groupby>
    </cfif>
    <cfif Len(Trim(arguments.orderby))>
      <cfset local.orderby = " ORDER BY " & arguments.orderby & " " & arguments.sortorder>
    </cfif>
  <cfset local.query = new Query()> 
    <cfset local.query.setAttributes(datasource=arguments.dsn)> 
    <cfset local.query.setAttributes(name="result")>
    <cfif ArrayLen(arguments.params)>
      <cfset local.wheresql = BuildSQLParams(local.query,arguments.params)>
    </cfif>
    <cfif Len(Trim(local.wheresql))>
      <cfset local.wheresql = " WHERE " & local.wheresql>
    </cfif>
    <cfset local.execute = local.query.execute(sql="SELECT #arguments.columns# FROM #arguments.tables##local.wheresql##local.groupby##local.orderby#")>
    <cfset result.query = local.execute.getResult()> 
    <cfset result.metaInfo = local.execute.getPrefix()>
  </cfif>
<cfreturn result>
</cffunction>


<!--- FUNCTION UDF: update query --->

<!--- 

Notes:
Use for executing sql with simple update queries: 

Supported:

- query attributes: datasource

Unsupported:

- apart from 'datasource', no other query attributes are supported

--->

<cffunction name="UpdateQuery" returntype="struct" output="false" access="public" hint="function description: read query">
  <!--- arguments --->
  <cfargument name="dsn" required="yes" hint="argument description: dsn" />
  <cfargument name="tables" type="string" required="no" default="" hint="argument description: tables">
  <cfargument name="setparams" required="false" default="#ArrayNew(1)#" type="array" hint="argument description: set params">
  <cfargument name="whereparams" required="false" default="#ArrayNew(1)#" type="array" hint="argument description: where params">
  <!--- local variables --->
  <cfset var result = StructNew()>
  <cfset var local = StructNew()>
  <!--- logic --->
  <cfset StructInsert(result,"query",QueryNew(''))>
  <cfset StructInsert(result,"metaInfo",StructNew())>
  <cfif Len(Trim(arguments.tables))>
  <cfset local.setsql = "">
  <cfset local.wheresql = "">
  <cfset local.query = new Query()> 
    <cfset local.query.setAttributes(datasource=arguments.dsn)> 
    <cfset local.query.setAttributes(name="result")>
    <cfif ArrayLen(arguments.setparams)>
      <cfset local.setsql = BuildSQLParams(local.query,arguments.setparams)>
    </cfif>
    <cfif Len(Trim(local.setsql))>
      <cfset local.setsql = " SET " & local.setsql>
    </cfif>
    <cfif ArrayLen(arguments.whereparams)>
      <cfset local.wheresql = BuildSQLParams(local.query,arguments.whereparams)>
    </cfif>
    <cfif Len(Trim(local.wheresql))>
      <cfset local.wheresql = " WHERE " & local.wheresql>
    </cfif>
    <cfset local.execute = local.query.execute(sql="UPDATE #arguments.tables##local.setsql##local.wheresql#")>
    <cfset result.query = local.execute.getResult()> 
    <cfset result.metaInfo = local.execute.getPrefix()>
  </cfif>
<cfreturn result>
</cffunction>

<cfset sqlarray = ArrayNew(1)>
<cfset wherearray = ArrayNew(1)>

<cfset ArrayAppend(sqlarray,{'column'='id','operator'='=','sqltype'='integer','value'='123','andOr'=','})>

<cfset ArrayAppend(sqlarray,{'column'='csp','operator'='=','sqltype'='integer','value'='5','andOr'=','})>

...

<cfset ArrayAppend(wherearray,{'column'='rec_id','operator'='=','sqltype'='integer','value'=id,'andOr'=''}>

<cfset UpdateQuery(dsn=application.datasource,tables="answers",setparams=sqlarray,whereparams=wherearray)>

还请注意，在您的组件中，可能应该这样访问此值： case GET_CHILD_NAME: return { ...state, childInformation: { ...state.childInformation, childName: action.payload } }; （但这当然取决于您如何将redux状态映射到value = {this.props.childInformation.childName}中的组件props。）

Answer 2

我明白了：）））

  export const getChildName = (e) => dispatch => {
  dispatch({
   type: GET_CHILD_NAME,
  payload: {childName:e.target.value}
 })
}

该值必须用花括号括起来。

如何将输入值发送到Redux存储？

2 个答案: