單向資料流動

2021-10-05 13:16:17 字數 2030 閱讀 1862

import uikit

import foundation

/單向資料流動

*****/

///

/// 新狀態 = f(舊狀態, 使用者行為)

/// func reducer(state: state, useraction: action) -> state

/// func reduce(_ initialresult: result, _ nextpartialresult: (result, element) throws -> result) rethrows -> result

/// 其中 reducer 對應的正是 reduce 中的 nextpartialresult 部分,這也是我們將它稱為 reducer 的原因

/// 使用單向資料流和 reducer 改進 view controller

protocol actiontype {}

protocol statetype {}

protocol commandtype {}

/// 除了限制協議型別以外,上面這幾個 protocol 並沒有其他特別的意義

class tableviewcontroller: uitableviewcontroller

struct state: statetype

enum action: actiontype

enum command: commandtype

lazy var reducer: (state, action) -> (state: state, command: command?) =

// 初始化 ui

statedidchanged(state: store.state, previousstate: nil, command: nil)

// 開始非同步載入 todos

store.dispatch(.loadtodos)

}func statedidchanged(state: state, previousstate: state?, command: command?)

}

if previousstate == nil || previousstate!.datasource.todos != state.datasource.todos 

if previousstate == nil || previousstate!.text != state.text

}override func tableview(_ tableview: uitableview, didselectrowat indexpath: indexpath)

store.dispatch(.removetodo(index: indexpath.row))

}@ibaction func addbuttonpressed(_ sender: any)

func inputchanged(cell: tableviewinputcell, text: string)

class tableviewcontrollerdatasource: nsobject, uitableviewdatasource

//...

func tableview(_ tableview: uitableview, cellforrowat indexpath: indexpath) -> uitableviewcell

func tableview(_ tableview: uitableview, numberofrowsinsection section: int) -> int protocol tableviewinputcelldelegate: class

class tableviewinputcell: uitableviewcell class store

func dispatch(_ action: a)

func subscribe(_ handler: @escaping (s, s, c?) -> void)

func unsubscribe()

react redux 資料流動

從登入過程看資料流動 因為登入介面是在父元件中,暫且將父元件起名為parent,所以我們需要將store 即所有狀態交由provider 給parent處理 container.js 登入介面 登入export connnect mapstatetoprops,mapdispatchtoprops ...

單向資料流

props是單向繫結的,當父元件的屬性變化時,將傳導給子元件,但是不會反過來 而且不允許子元件直接修改父元件中的資料,報錯 解決方式 方式1 如果子元件想把它作為區域性資料來使用,可以將資料存入另乙個變數中再操作,不影響父元件中的資料 方式2 如果子元件想修改資料並且同步更新到父元件,兩個方法 a....

單向資料流

doctype html html lang en head meta charset utf 8 title vue title script src bower components vue dist vue.js script head body div id box aaa aaa div ...