Question

我想在Elm中创建一个需要4个输入的表单：

3个浮点值
1输入，可以取＆＃34; long＆＃34;或＆＃34;短＆＃34; （大概）这将是一个下拉列表

输入值时，会发生计算，根据这些值产生单行输出。

我将它作为命令行Python程序工作：

#!/usr/bin/env python


from __future__ import print_function

# core
import logging

# pypi
import argh

# local

logging.basicConfig(
    format='%(lineno)s %(message)s',
    level=logging.WARN
)

def main(direction, entry, swing, atr):

    entry = float(entry)
    swing = float(swing)
    atr   = float(atr)

    if direction == 'long':
        sl = swing - atr
        tp = entry + (2 * atr)
    elif direction == 'short':
        sl = swing + atr
        tp = entry - (2 * atr)

    print("For {0} on an entry of {1}, SL={2} and TP={3}".format(
        direction, entry, sl, tp))

if __name__ == '__main__':
    argh.dispatch_command(main)

但希望使用Elm为其创建Web UI。

Answer 1

这不是Elm的理想首次介绍，因为它会引导您完成Elm的一些更难的区域：邮箱和Graphics.Input库。还没有易于部署的号码输入，所以我只实现了下拉列表;你使用Graphics.Input.Field（可能特别冒险）。

邮箱基本上是下拉输入可以向其发送消息的信号。我已经选择将该消息作为一个函数，具体来说，是如何从旧消息中生成一个新状态。我们将状态定义为记录类型（如Python命名为元组），因此保存方向涉及将新方向存储在记录中。

使用便利函数渲染文本monospace。你可以使用整个text library，但是Elm 0.15没有字符串插值，所以你很难接受相当难看的追加。

最后，关于SO的榆树社区并不多，但欢迎您加入mailing list欢迎这样的问题。话虽这么说，你真的应该尝试潜入榆树并学习基础知识，这样你就可以提出一个更具体的问题。几乎任何语言，图书馆或框架都是如此 - 你必须做一些基本的练习才能写出有用的＃34;代码。

import Graphics.Input as Input
import Graphics.Element as Element exposing (Element)

mailbox = Signal.mailbox identity

type Direction = Short | Long
type alias State = {entry : Float, swing : Float, atr : Float, dir : Direction}

initialState : State
initialState = State 0 0 0 Short

dropdown : Element
dropdown =
    Input.dropDown
    (\dir -> Signal.message mailbox.address (\state -> {state| dir <- dir}))
    [("Short", Short), ("Long", Long)]

state : Signal State
state = Signal.foldp (<|) initialState mailbox.signal

render : State -> Element
render state =
    dropdown `Element.above`
    Element.show ("For "++(toString state.dir)++" on an entry of "++(toString state.entry) ++
                  ", SL="++(toString (sl state))++" and TP="++(toString (tp state)))

main = Signal.map render state

-- the good news: these are separate, pure functions
sl {entry, swing, atr, dir} =
    case dir of
        Long -> swing - atr
        Short -> swing + atr

tp {entry, swing, atr, dir} =
    case dir of
        Long -> entry + (2*atr)
        Short -> entry - (2*atr)

更新：我在邮箱上写了an essay以及如何使用它们。

使用Elm创建表单

1 个答案: