红色使用反应方法更新VID中的文本

时间:2017-04-07 06:52:04

标签: red

Red [needs: 'view]

num: ["1^/"]
k: num/1

view [
     size 600x600
     txt: text 30x50 k
     ar: area 300x400 "" focus on-change[
         txt/size: ar/size
         len: length? split face/text newline
         either (len - face/data) > 0 [
               append num append form (len + 1) newline
               face/data: len
         ][
               remove back tail num
               face/data: face/data - 1 
          ]
          txt/text: form num
     ]
     do [ar/data: 0]
]

这个红色程序包含一个"文本面"和"区域面对"。文本面包含序列号的垂直列表。在区域面中添加换行符时,序列号将根据行数增加。当在区域面中移除一条线时,序列号也会减少。

这是使用非反应性方法。是否有一种被动的方法来做到这一点?

1 个答案:

答案 0 :(得分:0)

我相信您正在寻找react功能。反应框架是在this blog post中引入的,并且有一个非常类似的例子,即使用on-change将示例转换为其反应版本。

无论如何,我最近读了很多关于Red的事情,我正在寻找第一个练习;我的to-list实现可能会得到改进,但视图声明现在更加紧凑:

Red [needs: 'view]

to-list: function [text][
    ; converts text area string to list of numbers separated by newlines
    txt: copy text
    append txt "dummy" ; handle empty lines
    len: length? split txt newline
    x: copy ""
    repeat i len [ append x mold i append x newline]
]

view [ 
    size 600x600 
    text 30x600 react [
        face/text: to-list text-area/text
    ]
    text-area: area 300x400 ""
]