一、介绍svelte-ui 一款基于svelte3.x架构的桌面UI组件库。目前曾经降级至2.0版本了（30+ 组件）。在原有的根底上新增并优化了15+组件。
SvelteUI蕴含了罕用的按钮、文本框、下拉框、表格、表单及音讯提醒类等性能。
二、引入组件通过如下形式疾速引入组件。
import { Button, Input, Switch, Select, Form, ...} from 'svelte-ui'
三、疾速应用范例Form表单rule规定验证let ruleFormDomlet formRules = { name: '', region: '', delivery: false, type: [], resource: '', summary: '',}let rules = { name: [ { required: true, message: '请输出流动名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'change' } ], region: [ { required: true, message: '请抉择流动区域', trigger: 'change' } ], type: [ { type: 'array', required: true, message: '请至多抉择一个流动性质', trigger: 'change' } ], resource: [ { required: true, message: '请抉择流动资源', trigger: 'change' } ], // summary: [ // { required: true, message: '请填写流动详情', trigger: 'blur' } // ]}function onSubmitRules() { ruleFormDom.validate((valid) => { if(valid) { console.log('submit!') }else { console.log('error submit!') return false } })}function onResetRules() { formRules = { name: '', region: '', delivery: false, type: [], resource: '', summary: '', } ruleFormDom.resetFields()}<Form bind:model={formRules} rules={rules} bind:this={ruleFormDom}> <FormItem label="流动名称" prop="name"> <Input bind:value={formRules.name} /> </FormItem> <FormItem label="流动区域" prop="region"> <Select bind:value={formRules.region} clearable> <Option label="区域1" value="beijing" /> <Option label="区域2" value="shanghai" /> </Select> </FormItem> <FormItem label="即时配送" prop="delivery" required message="请勾选即时配送" trigger="change"> <Switch bind:checked={formRules.delivery} /> </FormItem> <FormItem label="流动性质" prop="type"> <CheckboxGroup bind:checked={formRules.type}> <Checkbox label="美食/餐厅线上流动" /> <Checkbox label="亲子主题" /> <Checkbox label="品牌推广" /> </CheckboxGroup> </FormItem> <FormItem label="非凡资源" prop="resource"> <RadioGroup bind:checked={formRules.resource}> <Radio label="线上品牌商资助" /> <Radio label="线下场地收费" /> </RadioGroup> </FormItem> <FormItem label="流动详情" prop="summary" rules={[{ required: true, message: '请填写流动详情', trigger: 'blur' }]}> <Input bind:value={formRules.summary} type="textarea" rows={3} /> </FormItem> <FormItem> <Button type="primary" on:click={onSubmitRules}>立刻创立</Button> <Button on:click={onResetRules}>重置</Button> </FormItem></Form>Table综合表格反对固定表头/列、单选/多选及内容超出滚动条展现。
...