Skip to content

Releases: ecomfe/veui

v1.0.0-alpha.35

23 Apr 09:30
Compare
Choose a tag to compare
v1.0.0-alpha.35 Pre-release
Pre-release

💡 主要变更

  • [^] 更新 date-fns 依赖到 2.x 版本。

v2.0.0-alpha.13

17 Apr 12:50
Compare
Choose a tag to compare
v2.0.0-alpha.13 Pre-release
Pre-release

💡 主要变更

  • [+] Autocomplete 组件新增了 option-label 插槽。
  • [+] OptionGroup 组件新增 before/after 插槽,用于在 popup 模式下在新开浮层上下插入自定义内容。

🐞 问题修复

  • [^] 修复了 Tab 组件的 label 等 prop 更新时视图没有同步更新的问题。
  • [^] 修复了 Menu 组件数据源在 SSR 环境下无限循环的问题。
  • [^] 修复了 Anchor 组件在 SSR 环境下访问 DOM 的问题。

v2.0.0-alpha.12

13 Apr 11:21
Compare
Choose a tag to compare
v2.0.0-alpha.12 Pre-release
Pre-release

🐞 问题修复

  • [^] veui 现在在 babel-plugin-veuipeerDependencies 中,以免多版本共存时 babel-plugin-veui 无法找到正确的 veui 版本。
  • [^] 修复了 Menu 组件非受控模式下第一次没有正确同步当前路由状态的问题。
  • [^] 修复了 Calendar 组件 disabled-date prop 对显示在本月的前后月日期未生效的问题(#644)。
  • [^] 现在 ButtonGroup 组件只有在按钮项 value 为字符串时抛出同名事件,避免在非字符串类型时报错。
  • [^] 去除了多选 Select 组件已选项默认滚动入可视区域的行为(因为可能有多个已选项)。
  • [^] 修正了开启搜索功能的 Dropdown 组件搜索栏和选项区域同时滚动的问题,搜索栏现在固定在下拉菜单顶端。

v2.0.0-alpha.11

03 Apr 11:26
Compare
Choose a tag to compare
v2.0.0-alpha.11 Pre-release
Pre-release

⚠️ 非兼容性变更

  • [-] 移除了 babel-preset-veui

  • [-] 移除了 veui-theme-one

  • [^] 对 Tabs 组件进行了重写,其中引入的非兼容性变更如下:

    • [-] 移除了 index prop,现在控制激活标签页只能使用 active prop。
    • [^] tabs-extra slot 更名为 extra,且仅包括提示区域的内容,不包括添加按钮。
    • [-] 移除了 tabs-extra-labeltabs-extra-tip slot。
    • [^] tab-item scoped slot 现在包含整个按钮/链接,方便替换为自定义实现。
    • [-] 移除了 tab-item-extra scoped slot,removableTab 组件始终显示移除按钮。
    • [^] 在路由模式下,不再自动输出 <router-view> 组件,需要通过 Tabdefault slot 或 Tabs 新增的 panel slot 中进行输出。

    其余变更:

    • [+] 新增了 tab-item-labeltab-label scoped slot,用于仅自定义标签项内容。

    • [+] 新增 panel slot,用于指定标签下方面板内的自定义内容。

    • [+] 新增 change 事件,回调参数为 tab 对像,包含 namelabeltostatus 等字段。

    • [+] Tab 组件新增了 item slot,用于自定义标签内容,与 Tabs 组件的 tab-item 对应,优先级更高。

    • [+] Tab 组件新增了 label slot,用于自定义标签内容,与 Tabs 组件的 tab-label 对应,优先级更高。

      使用指南

      使用 active prop 与 change 事件完全外部控制激活状态
      <veui-tabs :active="active" @change="tab => active = tab.name">
        <veui-tab label="A" name="a">Content A</veui-tab>
        <veui-tab label="B" name="b">Content B</veui-tab>
        <veui-tab label="C" name="c">Content C</veui-tab>
      </veui-tabs>
      使用 active.sync 双向同步激活状态
      <veui-tabs :active.sync="active">
        <veui-tab label="A" name="a">Content A</veui-tab>
        <veui-tab label="B" name="b">Content B</veui-tab>
        <veui-tab label="C" name="c">Content C</veui-tab>
      </veui-tabs>
      激活状态完全由组件内部控制
      <veui-tabs>
        <veui-tab label="A">Content A</veui-tab>
        <veui-tab label="B">Content B</veui-tab>
        <veui-tab label="C">Content C</veui-tab>
      </veui-tabs>
      (嵌套)路由模式

      在之前的版本,如果 Tab 组件的 default slot 未传入任何内容,路由模式下 VEUI 会自动在标签内容容器内渲染 <router-view>。这导致在不使用嵌套路由时或是希望灵活控制 <router-view> 位置时产生额外的问题。所以在这个版本中移除了这个逻辑,用户可以使用 Tabspanel slot 来统一在标签内容容器中输出 <router-view>,也可以在某些 Tabdefault slot 中输出 <router-view> 及额外内容来覆盖全局的 panel slot,甚至可以将 <router-view> 输出到其它任意合适的位置。

      <veui-tabs>
        <veui-tab label="A" to="content/a"/>
        <veui-tab label="B" to="content/b"/>
        <veui-tab label="C" to="content/c">
          <h3>Content C</h3>
          <router-view/>
        </veui-tab>
        <template #panel>
          <router-view/>
        </template>
      </veui-tabs>
      自定义标签项内容

      可以使用 Tabstab-item scoped slot 来自定义所有标签项的内容,也可以使用 Tabitem scoped slot 来自定义单个标签项内容(单个内容将覆盖整体的内容)。

      <veui-tabs>
        <veui-tab label="A">
          Content A
          <template #item="tab">
            <button
              type="button"
              class="foo-btn"
              :disabled="tab.disabled"
              v-bind="tab.attrs"
              @click="tab.activate"
            >
              {{ `${tab.label} ${tab.active ? '✅' : '' }` }}
            </button>
          </template>
        </veui-tab>
        <veui-tab label="B">Content B</veui-tab>
        <veui-tab label="C">Content C</veui-tab>
      </veui-tabs>

      如果只想定义文本区域的内容(不需重写点击激活等逻辑),请使用 Tabstab-labelTablabel scoped slot,用法类似。

      <veui-tabs>
        <veui-tab label="A">
          Content A
          <template #label="tab">Content A {{ ${tab.active ? '✅' : '' }` }}</template>
        </veui-tab>
        <veui-tab label="B">Content B</veui-tab>
        <veui-tab label="C">Content C</veui-tab>
      </veui-tabs>

🐞 问题修复

  • [^] 修复了 Transfer 组件删除已选项时报错的问题。
  • [^] 修复了 Transfer 组件和 Tree 组件在被禁用状态下依然可以添加已选项的问题。
  • [^] 修复了悬浮触发的 Tooltip 组件可能被错误关闭的问题。
  • [^] 修复了在局部输出全局样式时没有正确处理 Anchor 浮层的问题。
  • [^] 修复了 Overlay 组件没有响应 inline prop 变化的问题。
  • [^] 修复了 NumberInput 组件在 strong 模式下最大最小值没有正确工作的问题。

v2.0.0-alpha.10

12 Mar 12:39
Compare
Choose a tag to compare
v2.0.0-alpha.10 Pre-release
Pre-release

⚠️ 非兼容性变更

  • [^] 使用 Uploaderupload prop 自定义上传过程时,参数中的回调函数 onload/onprogress/onerror 中第一个参数 file 被移除,原来提供上传结果、进度或错误信息的第二个参数成为第一个参数。

    迁移指南

    原回调方法
    function upload (file, { onload, onprogress, onerror }) {
      const xhr = new XMLHttpRequest()
      xhr.upload.onprogress = e => onprogress(file, e)
      xhr.onload = () => {
        onload(file, JSON.parse(xhr.responseText))
      }
      xhr.onerror = e => onerror(file, e)
    
      // ……实际上传操作……
    }
    新回调方法
    function upload (file, { onload, onprogress, onerror }) {
      const xhr = new XMLHttpRequest()
      xhr.upload.onprogress = e => onprogress(e)
      xhr.onload = () => {
        onload(JSON.parse(xhr.responseText))
      }
      xhr.onerror = e => onerror(e)
    
      // ……实际上传操作……
    }

💡 主要变更

  • [^] Uploader 使用 upload prop 自定义上传过程时,如果返回一个函数,该函数将在用户操作取消或上传组件销毁时被调用,用来中断自定义上传过程。
  • [^] Uploader 没有通过文件类型校验、文件大小校验和自定义校验的文件现在会以上传失败的状态出现在文件列表中。
  • [+] Uploader 新增 prop picker-position,支持图片上传模式下控制上传按钮始终保持在列表最前面还是最后面。
  • [+] Uploader 新增可供外部调用的方法 addFiles,支持通过函数直接添加并上传文件。
  • [+] Menu 组件新增了 icon/before/after 三个插槽。

🐞 问题修复

  • [^] 修复了使用 tabs-extra 插槽时由于插槽位置错误可能引起报错的问题。
  • [^] 修正了 Menu 组件图标尺寸错误的问题。
  • [^] 调整了部分输入组件的样式,解决了在为组件最外层元素设置宽度后内部组件没有匹配尺寸的问题。
  • [^] 修正了 Table 组件在初始数据为空时(比如异步加载),滚动事件监听器没有正常初始化导致内容加载后,表头与内容横向滚动不同步的问题。

v2.0.0-alpha.9

09 Mar 10:36
Compare
Choose a tag to compare
v2.0.0-alpha.9 Pre-release
Pre-release

🐞 问题修复

  • [^] 修复了仍有部分局部输出全局样式对浮层不生效的问题。😭
  • [^] 修正了入口文件导出没有与最新组件列表同步的问题。
  • [^] 修正了 Schedule 组件 tooltip 提示可能失效的问题。

v2.0.0-alpha.8

04 Mar 12:38
Compare
Choose a tag to compare
v2.0.0-alpha.8 Pre-release
Pre-release

🐞 问题修复

  • [^] 修复了局部输出全局样式对浮层不生效的问题。

v2.0.0-alpha.7

04 Mar 08:08
Compare
Choose a tag to compare
v2.0.0-alpha.7 Pre-release
Pre-release

⚠️ 非兼容性变更

  • [-] 移除了 Button 组件的 loading 插槽。

💡 主要变更

  • [+] veui-theme-dls 新增了 @veui-root-element 变量,支持局部输出全局样式的功能。

    使用指南

    可以配置全局 Less 变量 @veui-root-element 为目标区域的元素名(这里必须是自定义元素),此时所有全局样式规则会自动调整到只针对该类元素内部生效,比如:

    @veui-root-element: v-app;

    此时输出的全局样式都会带上 v-app 前缀,如:

    v-app button,
    v-app [type="button"],
    v-app [type="reset"],
    v-app [type="submit"] {
      -webkit-appearance: button;
    }
    为什么要使用自定义元素?

    如果允许自定义前缀使用 ID 或类选择器、或者其它复合选择器,将会使全局样式的特异性过高,超过 VEUI 组件样式的特异性(比如 #app button > .veui-button),导致组件样式被全局 normalize 之类的样式覆盖,产生不符合预期的结果。而由于组件至少有一级类选择器,所以在这里我们只要合理使用自定义元素,就可以有效避免样式覆盖的问题。

🐞 问题修复

  • [^] 修复了 Table 组件初始时表头和内容列有时错位的问题。
  • [^] 修正了 Menu 引入了错误的尖角图标的问题。

v2.0.0-alpha.6

28 Feb 03:36
Compare
Choose a tag to compare
v2.0.0-alpha.6 Pre-release
Pre-release

⚠️ 非兼容性变更

  • [^] 删除了 Drawer 组件的 backdrop-closable prop,新增 outside-closable prop 来控制点击组件外区域时是否关闭。
  • [-] 移除了 Sorter 组件,仅在 Table 内部使用。
  • [^] Table 组件带边框的样式修改为依赖新增 prop bordered,而非通过 ui="bordered" 指定,并且当存在单元格合并(包括表格内容合并和嵌套表头时)必须输出带边框样式。

💡 主要变更

  • [+] 新增 Menu 组件。
  • [+] 指令式调用 Toast 组件时,支持传入自定义的渲染函数以输出非纯文本内容。
  • [+] Table 组件新增列分组(输出嵌套表头)功能支持。
  • [+] Table 组件新增固定列功能支持。
  • [+] Dialog 组件在 modal 模式下,新增滚动锁定功能支持。

🐞 问题修复

  • [^] 修复了 Toast 组件的进入动画。
  • [^] 修复了 Input 组件在非 WebKit 浏览器下报错的问题。
  • [^] 修复了 SearchBox 组件的 role 属性输出。

v2.0.0-alpha.5

24 Feb 03:21
Compare
Choose a tag to compare
v2.0.0-alpha.5 Pre-release
Pre-release

🐞 问题修复

  • [^] 修复了 Drawer 组件没有正确支持 overlay-class prop 的问题。
  • [^] 修正了 DatePicker 组件没有根据 week-start prop 处理快捷选项的问题。