bytedo
/
wkit
1
0
Fork 0
Code Issues Pull Requests Wiki Activity

51 Releases 53 Tags

  • 1.9.1 714d9ceb3b

    v1.9.1 Stable

    yutent released this 2023-04-21 15:26:27 +08:00 | 55 commits to master since this release

    • 增加raw()方法。

    用于告诉框架, 这是段原始的html文本, 需要解析成正常的节点对象。(这个一般是用于处理外部传入的html)。

    !!! 注意:
    该方法有一定的安全过滤, 如script标签不会被解析。

    import { html, raw } from '@bd/core'

html`
   ${raw('一大段html文本')}
`
    Downloads
     
  • 1.9.0 c9b21cd790

    v1.9.0 Stable

    yutent released this 2023-04-17 16:13:59 +08:00 | 57 commits to master since this release

    • 废弃lit的事件,重构事件系统
    • 全新的事件系统,支持以下修饰符, 可支持同时写多个修饰符。<button @click.stop=${this.handleClick}>click me</button>
      • .stop 阻止事件冒泡
      • .prevent 阻止默认事件
      • .self 仅当 event.target 是元素本身时才会触发事件处理器
      • .capture 与原生一致的逻辑
      • .once 与原生一致的逻辑
      • .passive 与原生一致的逻辑
    Downloads
     
  • 1.8.8 5326af856c

    v1.8.8 Stable

    yutent released this 2023-04-13 18:27:37 +08:00 | 58 commits to master since this release

    • 修复事件绑定在影子节点上时无法自动销毁的bug
    Downloads
     
  • 1.8.7 948c4e08c6

    v1.8.7 Stable

    yutent released this 2023-04-07 16:29:54 +08:00 | 59 commits to master since this release

    • 修复styleMap传值为0无效的bug
    Downloads
     
  • 1.8.5 87c79f56ec

    v1.8.5 Stable

    yutent released this 2023-04-06 11:50:26 +08:00 | 63 commits to master since this release

    • 优化动画执行, 结束后自动清除动画
    Downloads
     
  • 1.8.4 7ee22886cb

    v1.8.4 Stable

    yutent released this 2023-04-04 14:46:50 +08:00 | 64 commits to master since this release

    • 微调动画参数, 增加容错处理
    • 增加micro-bounce和slide 2种内置动画
    Downloads
     
  • 1.8.3 0ee7ddc6a1

    v1.8.3 Stable

    yutent released this 2023-04-04 13:55:01 +08:00 | 65 commits to master since this release

    • 动画方法增加返回值

    this.$animate() 执行返回一个Promise对象, 动画结束之后触发resolve

    Downloads
     
  • 1.8.2 724b3732a0

    v1.8.2 Stable

    yutent released this 2023-04-04 12:04:17 +08:00 | 66 commits to master since this release

    • 优化动画调用(this.$anim.start()修改为this.$animate()), 内置4种简单的动画不变 (fade, scale, bounce, rotate)

    用法

    对组件本身定义动画

    class Foo extends {
  static animation = {
    type: 'fade', // 可以是4种内置之一

    // 如果内置的动画不满足需求, 可以自定义, 语法详见   HTML的`Element.animate`文档
    custom: [
      {opacity: 0, ...}, // 阶段样式定义
      {opacity: 0.5, ...},
      ...
    ]
  }
}

// 声明之后, 便可在适当时机, 手动触发动画
// 出场动画
// this.$animate() 
// 离场动画
// this.$animate(true)

    对组件内的节点配置动画

    class Foo extends {
   
  render() {
    // 配置同上
    let options = {
      type: 'fade'
    }
    return html`<div ref="foo" #animation=${options}>这个是有动画的节点</div>`
  }

}

// 声明之后, 便可在适当时机, 手动触发动画
// 出场动画
// this.$refs.foo.$animate() 
// 离场动画
// this.$refs.foo.$animate(true)
    Downloads
     
  • 1.8.1 b36bb36fda

    v1.8.1 Stable

    yutent released this 2023-03-29 17:39:00 +08:00 | 68 commits to master since this release

    • 暴露fire方法
    Downloads
     
  • 1.8.0 363a2ce623

    v1.8.0 Stable

    yutent released this 2023-03-29 12:08:37 +08:00 | 69 commits to master since this release

    • 增加动画的支持, 并内置4种简单的动画 (fade, scale, bounce, rotate)

    用法

    对组件本身定义动画

    class Foo extends {
  static animation = {
    type: 'fade', // 可以是4种内置之一

    // 如果内置的动画不满足需求, 可以自定义, 语法详见   HTML的`Element.animate`文档
    custom: [
      {opacity: 0, ...}, // 阶段样式定义
      {opacity: 0.5, ...},
      ...
    ]
  }
}

// 声明之后, 便可在适当时机, 手动触发动画
// 出场动画
// this.$anim.start() 
// 离场动画
// this.$anim.start(true)

    对组件内的节点配置动画

    class Foo extends {
   
  render() {
    // 配置同上
    let options = {
      type: 'fade'
    }
    return html`<div ref="foo" #animation=${options}>这个是有动画的节点</div>`
  }

}

// 声明之后, 便可在适当时机, 手动触发动画
// 出场动画
// this.$refs.foo.$anim.start() 
// 离场动画
// this.$refs.foo.$anim.start(true)
    Downloads
     
1 2 3 4 5 ...