最小的响应式 UI 框架 Van.js,大家用过吗?

166 天前
 oyps

官网: https://vanjs.org/

简单来说,这个框架允许以下面的方式来创建 DOM 树,方法名等于标签名,并且可以嵌套。

const element = div({ class: 'box' },
    '文本内容 01', '文本内容 02', button('按钮名称')
)

示例如下:

import van from 'vanjs-core'

const { div, button } = van.tags

const App = () => {
    return div(
    	button({ class: 'btn btn-success' }, 'Click Me')
    )
}

van.add(document.body, App())

可以通过 const myValueState = van.state(value) 来创建状态值,通过 myValueState.val 来访问和修改状态值。

用了一段时间了,感觉特点就是特别的轻量简约,基本不需要配置环境,安装依赖包后就可以导入使用,还有个特点就是创建出来的 DOM 树直接就是原生的,整体上很有极客风范。

小项目拿来折腾还是很好玩的,不知道大家有没有使用过的,感觉怎么样。

3163 次点击
所在节点    程序员
10 条回复
fox0001
166 天前
类似的框架,用过 petite-vue 。响应式框架很爽,我写个小页面也喜欢用上它
BeijingBaby
166 天前
把本来用 html 写的,重新用 js 语法写一遍……
gdfsjunjun
166 天前
就像小程序的富文本?居然还是节点写法。
zsj1029
166 天前
这种可以用 jsx 语法插件配合写,自动全响应式,有个 mithril 不要太爽,早已放弃 react
GeekGao
166 天前
歪个楼,推荐 SolidJS
ragnaroks
166 天前
以前弄网易 buff 的捡漏机器人用过这个,只能说,如果条件允许还是上 react 、vue 吧
xR13zp0h67njQr2S
166 天前
感觉是 vue 或者 react 编译之后的样子
sleepm
166 天前
歪个楼,反应式,哪个值变化了,其他的跟着变化
响应式,窗口变化了,界面变化
imba.io 也不错
最小的,都是没有现成 ui 的,需要手撸 css
suyuyu
166 天前
@GeekGao solid 有推荐的组件库吗
GeekGao
166 天前

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/1056715

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX