salt-ui / saltui Goto Github PK

请按照以下模板填写

这是一个

• 错误报告
• 功能需求

SaltUI 版本

3.1.18

浏览器、操作系统等环境信息

复现步骤

• 你可以在这里提交你的 CodePen 链接以及描述复现的步骤

FAQ

• Q: 组件库怎么使用？
  A: 请看一下这里的开始使用文档，https://salt-ui.github.io/ ，saltui 是基于 React 的 UI 组件库，需要前端知识支撑。React 相关的基础知识，请自行学习。

• Q: 我有组件使用上的问题，如何能够最快速地得到帮助？
  A: 尽量详细描述自己使用的组件版本，重现步骤，最好是能够附上一个 demo，方便他人定位你的问题。我们推荐使用 codePen，http://codepen.io/eternalsky/pen/WpzYrv/

• Q: 我的应用打包之后 js 体积好大，如何优化？
  A: 首先请确保组件是按照按需加载的方式引用，详情请查看开始使用文档。其次，请检查自己的应用中是否有引用，但未真正使用的组件或者类库。最后，你可以尝试一下使用 code spliting，nowa 工具中集成了 require.ensure 的使用方法。

• Q: 我有钉钉 nativeAPI 的使用或者和钉钉容器层相关的问题？
  A: 请在钉钉上搜索群号“11768602”，加入“钉钉开发者交流群”咨询。

• Q: 我有 nattyFetch 使用相关的问题？
  A: 请扫描下方二维码，加入 nattyFetch 答疑群。

• Q: 我有 Refast 使用相关的问题？
  A: 可以在这里找到帮助：http://doc.refast.cn/

• Q: UXCore 的交流群在哪里
  A: 请扫描下方二维码进群。
  

• Q: 询问和钉钉 E 应用相关的问题？

• A: 请扫描下方e二维码，加入 E 应用共创组织获得支持。
  

• Q: 报错：Uncaught Error: Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.
  A: 这是 React min 版的提示，去掉 react.min.js 或者 react-with-addons.min.js 中的 min 才能看到真正的 React 报错。

• Q: 报错：Uncaught Error: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function but got: xxx
  A: 这通常是因为你的代码中引用了一个组件是没有的或者没有获取到，在控制台中打出来看下就明白了。

• Q: 报错：Uncaught Error: this.isMounted is not a function
  A: 这是 React 0.14.0 的 bug，请更换版本至 0.14.2 以上。

请按照以下模板填写

Collapse组件的上下箭头不能显示，现实的是乱码

• 错误报告

SaltUI 版本 3.3.0

UC浏览器（都是在UC浏览器上查看）、Win10操作系统等环境信息

复现步骤

1. 将官网的代码copy，然后访问，箭头显示异常。
   
   官网正常效果
   
   本地访问效果

• 你可以在这里提交你的 CodePen 链接以及描述复现的步骤

这是一个错误报告

• 错误报告

SaltUI 版本

3.3.1（最新）

官方Demo

https://salt-ui.github.io/components/slot
初始化时，设定默认选中值，弹出选择框，点击完成，并没有得到临时值

复现步骤

在官方Demo，弹出下拉框之前设置默认选中Value，如下代码
showSlot() { this.setState({value:[{ text:2004, value:2004 }]}); this.refs.slot.show(); }
弹出效果如图

点击完成没有得到2004，而是得到2000

请按照以下模板填写

这是一个

• 错误报告
• 功能需求

复现步骤

使用nowa创建的新工程，react是0.14.3版本，是否可以考虑升级一下react/react-dom/react-router等版本

请按照以下模板填写

这是一个

• [] 错误报告
• [ x] 功能需求

SaltUI 版本

2.2.3

浏览器、操作系统等环境信息

复现步骤

crumbs里的>能否提供一个配置项可以修改例如改成“/”

• 你可以在这里提交你的 CodePen 链接以及描述复现的步骤

官网的layer版本显示的1.1.0，但是nowa saltui脚手架的版本已经是1.1.12了，里面layer组件的字段相差很大。

这里又提一个Tab控件的问题。带有showScroll属性的Tab控件，在同一页面由于其他事件触发了Tab.Item个数变化后，宽度没有调整。

例子：http://codepen.io/LiangZugeng/pen/bqjMrV

第一次渲染只有一个Tab.Item，点击按钮后重新生成tabs数组，这次渲染有10个Tab.Item，可以看出再次Render以后Tab可见的Item还是一个（title改变了），但剩下的9个被折行了，看不见。

请按照以下模板填写

这是一个

• 错误报告
• 功能需求

SaltUI 版本

3.1.31
react 0.14.9

浏览器、操作系统等环境信息

chrome,win7 使用creact-react-app 创建的项目

复现步骤

页面中引入 import Dialog from 'saltui/lib/Dialog'

在点击事件中
addNurse() {
Dialog.alert({
title: '测试',
content: '我是 Dialog.alert 的调用',
onConfirm() {
console.log('alert confirm');
},
});
}

<button key="aler" onClick={this.addNurse.bind(this)}>add person</button>

报以下错误：
index.js:2177 Warning: React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or a ReactClass (for composite components). Check the render method of Dialog.

see here: Calendar/day/CascadePanel.jsx#L118-L120

请按照以下模板填写

这是一个

• 错误报告

SaltUI 版本

3.1.31

浏览器、操作系统等环境信息

chrome,win7

复现步骤

https://codepen.io/smilexlong/pen/XVKqEa
引用IconButton组件会报 Failed propType: Required prop children was not specified in IconButton

这是一个

• 错误报告
• 功能需求

SaltUI 版本

3.1.17

浏览器、操作系统等环境信息

Windows 10
> node -v
v8.9.0
> npm -v
5.5.1


---
package.json
...
"dependencies": {
    "react": "^16.1.1",
    "react-dom": "^16.1.1",
    "react-scripts": "1.0.17",
    "saltui": "^3.1.17"
}
...

复现步骤

1. 使用create-react-app创建应用；
2. 引入saltui，并简单修改App.js运行

import React, { Component } from 'react';
import logo from './logo.png';
import './App.css';
import { Button } from 'saltui';

class App extends Component {
  render() {
    return (
      <div className="App">
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <h1 className="App-title">欢迎使用SaltUI！</h1>
        </header>
        <p className="App-intro">
          <Button type="primary">一级按钮</Button>
        </p>
      </div>
    );
  }
}

export default App;

暂时的解决方案

在public/index.html引入nowa模板的在线资源

<script src="//g.alicdn.com/platform/c/??react/0.14.3/react-with-addons.min.js,react/0.14.3/react-dom.min.js,react-router/2.0.0/umd/ReactRouter.min.js,fastclick/1.0.6/lib/fastclick.min.js,lie/3.0.2/dist/lie.polyfill.min.js,salt-router/0.0.2/salt-router.min.js"></script>

错误截图

（1）在html通过<script>标签，会提示createClass is not a function
（2）在入口文件中，通过import方式引入，会提示reactDOM未定义
以我的理解是，在引入saltui.js之前要确保react以及react-dom先引入，所以请大神们指教，有没有什么更好的引入方式呢？

请按照以下模板填写

这是一个

• 错误报告
• 功能需求

SaltUI 版本

3.1.13

浏览器、操作系统等环境信息

复现步骤

• 增加较多的选项，使选项可以滚动

• 期望选项可以滚动，实际无法滚动

• 推测与 iscroll 的使用有关。

• 你可以在这里提交你的 CodePen 链接以及描述复现的步骤

同一个页面，并列使用多个带有showScroll属性的Tab控件，结构为：
<Tab showScroll><Tab.Item/><Tab.Item/></Tab> <Tab showScroll><Tab.Item/><Tab.Item/></Tab>

当第二个Tab控件的Item元素的总宽度超过第一个Tab控件的Item元素总宽度太多时，第二个Tab控件的后面一些Item将会被换行，又由于Tab的高度固定，所以从界面上来看后面的这些换行的Item感觉就像是没被渲染或者丢失了。

附图：第二个Tab应该显示到30，但最后一个显示的元素为28

解决方案已经由@光弘 通过钉钉提供，在第二个和以后的Tab上加上key属性并赋不同的值。

请修复此bug。

CheckboxField选中完成后，slotText空字符串显示不对

请按照以下模板填写

这是一个

• 错误报告
• 功能需求

SaltUI 版本

3.1.17

浏览器、操作系统等环境信息

复现步骤

• SelectField不支持icon属性

连续的连个toast ,第一个未结束，第二个又show 出来，在展示的时候会 闪烁 消失一下 又 显示。

SelectField滑动选择时，整个表单跟着滑动。

请按照以下模板填写

这是一个

• 错误报告

SaltUI 版本

浏览器、操作系统等环境信息

复现步骤

• 你可以在这里提交你的 CodePen 链接以及描述复现的步骤

1. type: waring 时图标错误。
2. 建议message可以支持一行显示，超出之后... 。

这是一个

• 错误报告
• 功能需求

SaltUI 版本

salt-tab@^2.1.3

浏览器、操作系统等环境信息

钉钉 4.2.0
ios 11.1.2

复现步骤

• 钉钉内 tab 中放置了一个 table, 且 tab 不在第一屏可视化内，此时 table 会出现渲染不出来，dom 渲染出来了，需要出发下重绘页面才能限制。

原因

• tab 中的样式 transform:translateX 导致

style="transform:translateX(0%) translateZ(0);-webkit-transform:translateX(0%) translateZ(0);-moz-transform:translateX(0%) translateZ(0);"

see title

pm WARN deprecated [email protected]: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
npm WARN deprecated [email protected]: express 2.x series is deprecated
npm WARN deprecated [email protected]: connect 1.x series is deprecated
npm WARN deprecated [email protected]: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
npm WARN deprecated [email protected]: graceful-fs v3.0.0 and before will fail on node releases >= v7.0. Please update to graceful-fs@^4.0.0 as soon as possible. Use 'npm ls graceful-fs' to find it in the tree.
npm ERR! code E404
npm ERR! 404 Not Found: @ali/gitlab-apis@^2.1.0

npm ERR! A complete log of this run can be found in:

tabbar组件对图标替换中，包含了图片地址url的判断，导致如果引入的图片是base64编码后的图片，那么就无法显示替换后的图片了。

SearchBar组件用到了hash，这个会造成单页面应用的路由混乱

我在一个页面嵌套使用了带有showScroll属性的控件，控件由代码生成，基本的结构为：
Tab
|-Tab.Item
　|-Tab
　　|-Tab.Item
　　|-Tab.Item
|-Tab.Item
　|-Tab
　　|-Tab.Item
　　|-Tab.Item

如果没有showScroll属性，在切换parentTab的Item时，此Tab.Item下的Tab显示正常（由于没有使用showScroll，tab.item只显示了第一个字符，这不是问题）。但把parentTab和childTab都加上showScroll属性时，只有第一个parent Tab.Item下的Tab显示正常，其他parent Tab.Item下的Tab都只显示第一个Tab.Item。参见附图。

Repro代码地址：https://github.com/LiangZugeng/saltUITabIssue3Repro

附图1：没有使用showScroll属性，第一个parent Tab.Item为激活状态：

附图2：没有使用showScroll属性，第3个parent Tab.Item为激活状态：

附图3：使用showScroll属性，第一个parent Tab.Item为激活状态：

附图4：使用showScroll属性，第2个parent Tab.Item为激活状态：

这是一个

功能需求

SaltUI 版本

//g.alicdn.com/platform/tingle-ui/2.2.3/salt-ui.min.js

浏览器、操作系统等环境信息

安卓手机会出现，有的时候快，有的手机慢

复现步骤

安卓手机
searchbar 搜索结果的列表，在输入框输入内容时，键盘会弹出。当收起键盘的时候，可以看到 class t-search-bar-list 的 css 属性 position: fixed; 当键盘收起的过程中，可以看到 t-search-bar-list 覆盖元素下的 那部分内容

请按照以下模板填写

这是一个

• 错误报告
• 功能需求

SaltUI 版本

3.1.11

浏览器、操作系统等环境信息

复现步骤

• 你可以在这里提交你的 CodePen 链接以及描述复现的步骤
• tab 型级联选择
• 点击选项切换到最后的叶子节点
• 通过 tab 切换到上一级
• 再点击选项后切换不到下一级。

请按照以下模板填写

这是一个

• [] 错误报告
• 功能需求

SaltUI 版本

2.2.3

浏览器、操作系统等环境信息

复现步骤

crumbs显示中的>需要提供一个配置项来修改内容例如改成：/

• 你可以在这里提交你的 CodePen 链接以及描述复现的步骤

错误报告

search-bar组件 placeholder字段超长的时候

复现步骤

• https://salt-ui.github.io/components/search-bar 设置placeholder的值为长字段

应该为左对齐。

请按照以下模板填写

这是一个

• 错误报告
• 功能需求

SaltUI 版本

浏览器、操作系统等环境信息

复现步骤

• 你可以在这里提交你的 CodePen 链接以及描述复现的步骤

这是一个

• 错误报告
• 功能需求

SaltUI 版本

3.1.18

浏览器、操作系统等环境信息

iPhone6s 10.3

复现步骤

在iphone机上，点击输入框时，有时候，取消按钮会闪现到左边，然后再回到右边，如下图：

输入框获取焦点时，水印从中间滑动到左边的动画不平滑

• 你可以在这里提交你的 CodePen 链接以及描述复现的步骤

这是一个

• 功能需求

复现步骤

当instantSearch设置为false时，我空搜索后没有反应不触发onSearch事件，只有有值的时候才会触发搜索事件
https://codepen.io/anon/pen/XVjgXQ?editors=1111

这是一个

• 功能需求

SaltUI 版本

3.1.15

浏览器、操作系统等环境信息

复现步骤

• 点击搜索框进入搜索模式
• 输入关键字按搜索或者完成进行搜索
• 搜索完成之后自动退出搜索模式

https://salt-ui.github.io/components/tingle-tab scroll参数不对。

请按照以下模板填写

这是一个

• 错误报告
• 功能需求

SaltUI 版本

3.1.14

浏览器、操作系统等环境信息

复现步骤

• 配置选项时有的选项没有达到想要的层级（比如正常显示三级、但只有一级）
• 划到这样的选项时会出现 SLot 只有一列并且居中对不齐的情况出现。

https://salt-ui.github.io/components/tingle-ui

文件变化

• 重复的文件进行了合并
• JS 只剩下：salt-ui.js, salt-ui.min.js
• CSS 只剩下：salt-ui.css（橙色）, salt-ui.min.css（橙色），dd.css（钉钉蓝），dd. min.css（钉钉蓝）

IconSource/Icon

• 移除
• 【推荐】项目中引入 svgICon，可以使用 salt-svg-loader 配合 webpack 来引入，我们在 salt-svg-loader 中做了大量的工作，保证你在使用中以最小的成本，兼容最大程度的浏览器。
• 【推荐】同时，SaltUI 也提供了自己的一个常用图标库 salt-icon，也可以直接使用。
• 【不推荐】如果您仍然习惯 Symbol 的使用方式（这种方式会带来一些浏览器兼容性问题），但需要您自己插入对应的 symbol。

import Icon from ' salt-icon/dist/Symbol';

render() {
    return <Icon name='icon-name'/>
}

Tab

• 删除了 scroll/showScroll，
• 删除了 pendant
• 新的交互方式，会自动调整 tab 的展示，以上参数都用不到了

SearchBar

• 该组件本身不再支持历史等，仅保留搜索框
• 抽出了一个子组件 WithContainer，保留原来的使用方式，即等同于原来的 SearchBar，可平滑替换如下：

<SearchBar.WithContainer
  onSearch={(value)=> {
    console.info(`Do search>>${value}`);
  }}
>
  {this.renderSearchResult()}
</SearchBar.WithContainer>

Calendar

• 仅保留日历面板，支持选择单个日期、日期区间

• 移除了如下功能：

  • Calendar.MonthCalendar：
    • 如果想选择月份，请换用 Datetime/DatetimeField 组件；
    • 如果想选择月份区间，请换用 CalendarField 组件；
  • Calendar.YearCalend：
    • 如果想选择年份，请换用 Datetime/DatetimeField 组件；
    • 如果想选择年份区间，请换用 CalendarField 组件；

• 还移除了：

  • showTopPanel：viewMode 为 popup 时，就会出现 topPanel，不再设置
  • extraClass
  • onMaskClick（请换用maskClosable和onMaskClose）
  • onTitleClick
  • calendarCode，原来的作用是渲染行程等信息，可使用 renderCustomDayLabel() 替代
  • onSelecting：请换用 onChange

• 其它，请看下面的 history

CalerdarField

• 依赖 Calendar 及 Datetime
• type 可选值在原来 year, month, day(面板形式) 的基础上扩充了另外三个：dayWithSlot(拨盘形式), dayWithHalf（提供上下午选择）, dayWithTime（提供时分选择）

DatetimeField

• 从其中提取出了 Datetime，作为一个新组件，可提高复用性。

Breaking Changes

• value：
  • 增加了object类型支持，使用timeType字段表示上/下午
  • 取消了字符串类型
• columns 不再支持展示列自由组合，改为以 DatetimeField.YMD 等常量形式给出，详见 readme
• onSelect 参数改为对象，value 字段表示时间戳，timeType 字段表示上/下午

ScrollList

Breaking Changes

• 删除

  • 不再依赖 iscroll
  • pushLoadTip
  • cache
  • clearCache 方法

• 增加

  • refreshing
  • loading
  • noMore

• 运行机制变动

  • 使用 tingle-scroll-view 封装实现，去除了 iscroll 的依赖
  • 底部加载的交互方式从手动上拉加载更换为触底自动加载
  • onLoad 回调分解为两个方法：onRefresh 和 onLoad。分别对应下拉刷新和触底加载的回调。

• 注意事项

  • 新版本的 dom 结构和 class 名称有变化，做了自定义样式的同学需要验证一下新版本的展示是否正确
  • onLoad的使用方式有变化，分解为了 onRefresh 和 onLoad

Note

• 删除
• 请使用 NoticeBar 替代
• type可选值移除message，用info替换，另外还支持 'success','error','warning'
• 移除closable、closeText，换用 optionsType

Box

改为 Boxs

我没有找到声明文件呢，是否支持Typescript呢？

请按照以下模板填写

这是一个

• 错误报告
• 功能需求

SaltUI 版本

3.x

浏览器、操作系统等环境信息

复现步骤

• 你可以在这里提交你的 CodePen 链接以及描述复现的步骤

如题，稍微用力就会触发点击事件而跳转

I have the problem when i start the code npm run tnpm-dep：

events.js:160
  throw er; // Unhandled 'error' event
  ^

Error: spawn tnpm ENOENT
    at exports._errnoException (util.js:1022:11)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:193:32)
    at onErrorNT (internal/child_process.js:359:16)
    at _combinedTickCallback (internal/process/next_tick.js:74:11)
    at process._tickCallback (internal/process/next_tick.js:98:9)
    at Module.runMain (module.js:606:11)
    at run (bootstrap_node.js:394:7)
    at startup (bootstrap_node.js:149:9)
    at bootstrap_node.js:509:3 

some idea?

第一次显示当前项，第二次默认跳转第0项
请修复此bug

请按照以下模板填写

这是一个

• 错误报告
• 功能需求

SaltUI 版本

3.1.17

浏览器、操作系统等环境信息

复现步骤

• 你可以在这里提交你的 CodePen 链接以及描述复现的步骤

日历选择组件点击打开时页面会滚到最底部

• 错误报告3.1.8

在乐高中使用

macos chrome