Elm : enter press에서 Chrome의 contenteditable div에 br 태그를 추가하는 방법은 무엇입니까?

Question

contenteditable에서 Enter 키를 누르면 Chrome에 div이 추가 된 것으로 보입니다. 항상 br을 사용하고 싶습니다. SO (및 interwebs)에는 js 예제가 많이 있지만 Elm을 처음 사용하고 있으며이를 수행하는 방법에 대한 많은 정보가 없습니다.

onKeyPress : (Int -> msg) -> Attribute msg 
onKeyPress tagger = 
    on "keypress" (Decode.map tagger keyCode) 

을하지만, 함수를 사용하는 방법을 grokking하고 있지 않다 :

나는 GitHub의에이 코드를 건너왔다.

view : Model -> Html Message 
view model = div [ contentEditable True, onKeyPress SomeMessage] [] 

메시지 유형은 다음과 같이 보일 것이다 : 내보기는 다음과 같이 보일 것이다

type Message 
= None 
| SomeMessage Int 

을 그리고 업데이트가 될 것이다 뭔가 같은 :

update : Message -> Model -> (Model, Cmd Message) 
update message model = 
    case message of 
     SomeMessage (Ok isThisTheKeyCode) -> 
      (model, Cmd.none) 

     SomeMessage (Err err) -> 
      (model, Cmd.none) 

입력 필드 예제가 있습니다 그러나 나는 그것들이 다르다고 생각한다.

올바른 방향으로 나를 가리키거나 틈을 메우면 큰 도움이됩니다. 고마워요

업데이트 : 분명히, 나는 이것이 JavaScript로 어떻게 이루어 졌는지 알 수 있습니다. 느릅 나무 구현에 대한 지원이나 지시를 요청합니다. 감사합니다.

업데이트 2 : 나는 올바른 방향으로 가고 있다고 생각합니다. 내 구현 실제로 거기에 다른 contentEditable 함께 div 있었다. 내부 div는 제가 업데이트하려고하는 것입니다.

div [ contentEditable True][ 
    div [contentEditable True] 
    [] 
] 

나는

div [ contentEditable True][ 
    div [] [] 
] 

아직도 당신은 by referring this에 의해 기본 단락 구분을 변경할 수 있습니다 크롬

Answer 1

에 div에 대한 br을 대체하는 방법을 알아 내려고처럼 내부의 contentEditable이 이제 보인다 제거. 그러나 달성하고자하는 것은 Shift + Enter 조합으로 가능합니다.