alibaba / alist Goto Github PK

目前item的name在初始化阶段构造的，如果组件的属性变更了Item关联的core的name并不会变更。

Describe the bug
手动调用 form.core.scrollToError()，并不能滚动到错误元素

Additional context
component/FormItem.js 有 id 属性的元素，使用的 FormItem id
core/form.js scrollToError 定位元素使用的 id，是 core/item id

两个 id 不一致【某些条件下】，故无法定位，尝试在 component/FormItem.js render 内给任一元素添加 id={itemContext.item.id} 即可修复

复现地址：https://codesandbox.io/s/mystifying-torvalds-qrf8j?file=/index.js
尝试在列表渲染前，设置一些默认选中项，但是无效，列表状态依然都是未选中

例如我的数据是

{
 list:[1,2,3]
}

目前我的做法是自己写一个ListComponent来实现
noform 对于这种类型的数据如何处理呢？
可否用repeater

描述
在antd中，我对DatePicker传入的值不是moment对象的时候，noForm没有显示值也没有报错

期望
希望报出antd的错误提示

in url https://alibaba.github.io/nopage/#/nopage/noform/antd-best-pratise
antd-best-pratise should be antd-best-practice.
The word PRACTICE should be noun with no typo.

src/validate/index.js

没有使用文档、怎么配置错误信息的国际化 - 没有找到文档

Please replace the https certificate to provide access

thanks!

数据结构如下

详细报错如下

在获取完form数据后，完调用this.core.reset(),出现上述异常 有几个问题如下：

1. 如果是嵌套表单，IF条件不满足的属性为什么如何不显示？或者不存在最终的 this.core.getValues()
2. 结果中, 除了reset方法有其他清空表单数据的方法么？

使用TextArea时，一直报错，看了下demo，发现名字改成Textarea了

是否支持Vue呢？

有些场景可能需要用户对 repeater 进行排序操作，目前在文档没有看到这方面的功能。

I use following code to initiate NoForm. But the latest line throw error on runnig.

import antdWrapper from 'noform/dist/wrapper/antd';
import * as antd from 'antd';
const { Select, Button, Input } = antdWrapper(antd);  // Error: antd was undefined.

It works when change import to require method.

const antd = require('antd');  // It's ok 

Would you like give me some suggestion .

https://alibaba.github.io/noform/examples/build 这个 Demo 好像上传的有问题啊。

GET https://alibaba.github.io/static/css/main.1b4f8fcc.css 404 ()

Describe the bug
使用noform报错：ReferenceError: regeneratorRuntime is not defined

To Reproduce

1. yarn add noform
2. 在myproject/src/views/product/index.js 里实现demo（https://alibaba.github.io/noform/#/zh-CN/docs?md=easy/easy ）

Expected behavior
正常显示表单

Screenshots

Desktop (please complete the following information):
babel相关：
"babel-core": "6.26.0",
"babel-eslint": "7.2.3",
"babel-jest": "20.0.3",
"babel-loader": "7.1.2",
"babel-plugin-import": "^1.8.0",
"babel-plugin-transform-decorators-legacy": "^1.3.5",
"babel-preset-react-app": "^3.1.1",
"babel-runtime": "6.26.0",

Additional context
在 myproject/node_modules/noform/lib/index.js 里手动引入babel-polyfill 解决问题：

当然，在我项目入口手动 require('babel-polyfill') 也可以，但感觉第三方库可以入口引下，或者提示下使用者

How does NoForm implement additional form tips in ANTD, such as :Extra
<Form.Item label="Plain Text" extra=“Warm prompt”>
China
</Form.Item>

[email protected]
[email protected]

...
this.core = new FormCore({
      values: {
        accessNumber: '',
        numberType: 'INNER_CENTREX_TYPE',
        confType: 'ScheduleConference',
        authType: 1,
        shareable: true,
        useWildCard: false
      },
      validateConfig: {
        accessNumber: [
          {
            required: true,
            message: t('rule.access-number.number.required')
          },
          {
            type: 'string',
            pattern: /^[+][0-9]{1,31}$/,
            message: t('rule.access-number.number.pattern')
          }
        ]
      },
      autoValidate: true
    });
...

...
  method = () => {
    this.core.reset(); // I want to initial value but null.
  }
...

Antd Checkbox.Group 有自定义布局的功能，在 wrapper 后，这个功能有异常。具体情况如下：

• 有且只有在 Checkbox.Group 传入 options 属性下有效。但是此时不能使用 Grid 布局。
• 在 Checkbox.Group 下使用 children 方式输出节点，不管是 Col 还是 Checkbox 都会导致：点选任意一个选择框，所有选择框都会被选中。

代码如下

<Checkbox.Group
    // options={groupData}
>
    {
        {/*<Col>*/}
        groupData && groupData.length > 0 && groupData.map(data => (
            <Checkbox key={data.value} value={data.value}>{data.label}</Checkbox>
        ))
        {/*</Col>*/}
    }
</Checkbox.Group>

https://github.com/quirkyshop/noform-start-app/blob/master/src/examples/NestedForm.jsx

比如这里面的嵌套Form, 如何在最外层主动触发里面Form的验证

 <FormItem label="livenessProbe" name="livenessProbe">                   
                    <Form layout={false}>

Describe the bug
[email protected]
[email protected]
[email protected]
用 noform/lib/wrapper/antd.js 包裹后的 Select placeholder 不生效，即便已配置

defaultValue: null

Additional context

经 noform 包裹后， Select 会获得一个 value: '', 而在 rc-select 内，则会 state.value: [""]，因此不会显示 placeholder

See demo: https://codesandbox.io/s/blissful-fog-ixhix

Note: Maybe antd's limitations.

似乎 d.ts 文件内有很多 interface/type 没有被 export
其中就有 FormCore.

此外 FormCore 的定义中，有很多方法缺失，如： getValues: ()=>{}

期待早日完善 ↖(^ω^)↗

如上图所示，用户输入完条形码之后，系统需要给一个打印条形码的功能，我希望能跟保存，删除按钮放在一起。

另外，自定义按钮能否支持条件显示，比如当每一行的数据处于预览态时，打印按钮出现，其他状态按钮隐藏

如题。

描述

我在子组件(结构大概是<antd.Modal visible={false}><Form /><antd.Modal>)的componentWillMount里创建了FormCore，然后调用了父组件的方法把这个FormCore的引用传给了父组件，用以在父组件中操作form

需求

需要在父组件中获取子组件中所有FormItem的name值，用以根据业务判断是否需要赋值一个初始化的值

问题

因为FormCore.getValues()是不能获取到空值的属性的，所以我改为通过遍历FormCore.children的方式获取name，我在父组件首次设置子组件的antd.Modal的visible为true，并获取core.children时，因为渲染没有完成导致core.children里是空的, 所以我还是没有办法获取表单里的name

现在是通过设置antd.Modal的forceRender来解决，但是之前用antd的form.getFieldsValue()可以获得没有值的name，比如：{key: null}，就不用forceRender了

期望

希望有一个比如formCore.getNames()的方式来获取formItem的name

如题
我现在遇到的问题是构建走得都是lib
于我业务代码中的antd不在同一上下文
导致antd全局配置不能共享

https://alistjs.netlify.app/ 这个网站好多页面打不开，有时候整个网站都打不开

能否提供更复杂点的demo, 多级字段
const formData = { name: 'aaa', ports: [ // 列表 {port: 8080, targetPort: 9090}, {port: 9090, targetPort: 9091}, ], livenessProbe: { exec: [{command: '/bin/sh'}], // exec与http只会出现一个 http: [{port: 9090}], }, img: '' // 异步获取 }

这个项目目前还维护吗，还有怎么自定义布局，默认使用 Table,

在noform/repeater/factory.js文件中

 async componentWillReceiveProps(nextProps) {
            const { filter, asyncHandler, formConfig } = this.props;
            const manualEvent = this.genManualEvent();
            if (deepEqual(this.props, nextProps) && !manualEvent.type) {
                return;
            }

            if (!deepEqual(asyncHandler, nextProps.asyncHandler)) {
                this.repeaterCore.asyncHandler = nextProps.asyncHandler;
            }
}

问题1：
deepEqual（this.props, nextProps）里面会有react节点，节点会有循环引用的情况， 导致deepEqual死循环， 推荐单独判断需要的字段而不是直接deepEqual
问题2：
使用reacthook之后方法的每次渲染都是一个新的

function OutputForm({ nodes }) {
    const afterSetting = (event: any, repeater: any) => {
       // use 变量nodes
    };

    return (
xxx
<InlineRepeater
    multiple
    asyncHandler={{
          afterSetting,
     }}
>
xxx
  ）

这里的afterSetting方法每次渲染都是一个新的，里面引用的变量nodes可能有变化，但是deepEqual并不能识别出来这是一个新的方法， 导致后面的新afterSetting无法正确设置this.repeaterCore.asyncHandler。所以afterSetting触发的一直都是第一次渲染的那一个afterSetting， 而第一次渲染的时候afterSetting方法里面使用的props.nodes是[]空的。