redux
個人心得
第一步:
在index.js 裡面
importreact from
'react'
importfrom
'react-dom'
importfrom
'react-redux'
importconfigurestore from
'./store/configurestore'
這個檔案裡面其實是配置
資料store
匯出的其實是乙個函式
importhello from
'./containers/hello'
引入元件
conststore = configurestore()
因為匯出的是函式所以加括號()
render(
store
=>
引用上面的元件
,document.getelementbyid(
'root'))
第二步:
開啟store配置檔案
importconfigurestore from
'./store/configurestore'
找到並且開啟這個檔案
配置store的檔案⬇⬇
⬇importfrom
'redux'
importfrom
'redux'
資料集合
importuserinfo from
'./userinfo'
使用者資訊的資料
constrootreducer = combinereducers()
export default functionconfigurestore(initialstate) ⬇⬇
⬇importuserinfo from
'./userinfo'
接著分析下,開啟這個使用者資料規則⬇
⬇⬇constinitialstate = {} 定義所有的初始化狀態在這裡
例如:使用者資訊資料,管理員資料...輪播資料
export default functionuserinfo(state = initialstate
, action)
}最後開啟 hello元件
importreact from
'react'
importfrom
'react-redux'
importfrom
'redux'
使用者資料集的actions 方法函式
import*asuserinfoactions from '../actions/userinfo' 得到的是乙個物件方法 userinfoactions.abc 這樣的
importa from
'../components/a'
importb from
'../components/b'
importc from
'../components/c'
classhelloextendsreact.component
/>
userinfo
=/>
actions
=/>)}
5.生命週期函式,載入完成的時候觸發函式
傳的乙個json 過去 action方法集合的login
componentdidmount() )}}
functionmapstatetoprops(state)
}7. userinfoactions是action方法裡面的
functionmapdispatchtoprops(dispatch)
}export defaultconnect(
mapstatetoprops
,1. 把props屬性值塞到 hello元件裡
mapdispatchtoprops
)(hello)
2. 然後這個hello元件就可以獲取 store資料⬇⬇
⬇開啟action方法,其實就是一堆函式方法
export functionlogin(data)
}只要觸發了action方法就會改變資料 傳送給計算規則
就是userinfo,傳的物件,json action.type
然後執行mapstatetoprops(state)對映,就顯示了
export functionupdatecityname(data)
}會點php的前端小渣渣
2018、4、12
Ant testng selenium基本配置
ant 配置 1 在工程根目錄下新增 build testng xslt.xml 2 新建lib目錄,新增xml檔案裡的jar包 3 新建res目錄,新增testng results.xsl 檔案 build外掛程式美化報包需要 testng.xml檔案也放置在根目錄 報告目錄,工程 report ...
create react app腳手架基本配置講解
或者直接設定npm的預設倉庫 npm config set registry 首先初始化乙個專案 下面就專案目錄結構進行分析 1 專案目錄下面的public和src目錄下的index檔案必須存在且不能修改名稱 其他的檔案可以刪除和修改名稱,因為webpack只會編譯src目錄下面的檔案,所以專案中需...
webpack學習之webpack基本配置
壓縮檔案 分割 提取公用 模組合併 把多個模組合併 自動重新整理 熱更新 改變,自動重新整理頁面 由於外掛程式可以攜帶引數 選項,必須在 webpack 配置中,向 plugins 屬性傳入的是外掛程式的例項。let require clean webpack plguin new cleanweb...