Purescript 卤素组件,输入与状态
Purescript Halogen Component, Input vs State
我想制作一个卤素组件,该组件的输入与其状态不同。根据卤素 (https://github.com/slamdata/purescript-halogen/blob/master/docs/5%20-%20Parent%20and%20child%20components.md#input-values) 指南,这应该是可能的。我将指南中的示例更改如下
import Prelude
import Data.Int (decimal, toStringAs)
import Halogen as H
import Halogen.HTML as HH
import Halogen.HTML.Events as HHE
type Input = Int
type State = String
data Query a = HandleInput Input a
component :: forall m. H.Component HH.HTML Query Input Void m
component =
H.component
{ initialState: id
, render
, eval
, receiver: HHE.input HandleInput
}
where
render :: State -> H.ComponentHTML Query
render state =
HH.div_
[ HH.text "My input value is:"
, HH.strong_ [ HH.text (show state) ]
]
eval :: Query ~> H.ComponentDSL State Query Void m
eval = case _ of
HandleInput n next -> do
oldN <- H.get
when (oldN /= (toStringAs decimal n)) $ H.put $ toStringAs decimal n
pure next
但是我在 , receiver: HHE.input HandleInput
的那一行遇到了一个编译错误
Could not match type
String
with type
Int
我做错了什么?
initialState
是使用输入值计算的,在您粘贴的代码中它被实现为 id
,因此它试图强制输入和状态类型匹配。
更改了 { initialState: const initialState
中的行 { initialState: id
并在 where
之后添加了以下行
initialState :: State
initialState = ""
我想制作一个卤素组件,该组件的输入与其状态不同。根据卤素 (https://github.com/slamdata/purescript-halogen/blob/master/docs/5%20-%20Parent%20and%20child%20components.md#input-values) 指南,这应该是可能的。我将指南中的示例更改如下
import Prelude
import Data.Int (decimal, toStringAs)
import Halogen as H
import Halogen.HTML as HH
import Halogen.HTML.Events as HHE
type Input = Int
type State = String
data Query a = HandleInput Input a
component :: forall m. H.Component HH.HTML Query Input Void m
component =
H.component
{ initialState: id
, render
, eval
, receiver: HHE.input HandleInput
}
where
render :: State -> H.ComponentHTML Query
render state =
HH.div_
[ HH.text "My input value is:"
, HH.strong_ [ HH.text (show state) ]
]
eval :: Query ~> H.ComponentDSL State Query Void m
eval = case _ of
HandleInput n next -> do
oldN <- H.get
when (oldN /= (toStringAs decimal n)) $ H.put $ toStringAs decimal n
pure next
但是我在 , receiver: HHE.input HandleInput
Could not match type
String
with type
Int
我做错了什么?
initialState
是使用输入值计算的,在您粘贴的代码中它被实现为 id
,因此它试图强制输入和状态类型匹配。
更改了 { initialState: const initialState
中的行 { initialState: id
并在 where
之后添加了以下行
initialState :: State
initialState = ""