模块化思想很重要

比如中英文的问题，可以新建各个模块的js文件，导入到主文件。然后就能避免文件git冲突

vue3项目package.json里面依赖版本前面的符号要了解下。

^号对jinkens有影响。element组件库低升高，高降到中版本，降不下去。

react antd form表单一些坑记录

1. 在rules自定义校验里写前一项控制后一项。也可以form.setFieldValue("name", "xxx")设置后一项的值

<Form.Item
          style={{
            width: "45%",
            marginBottom: 20,
          }}
          name="fileName"
          label="选择升级文件"
          rules={[
            {
              required: true,
              message: "请选择升级文件",
            },

            () => ({
              validator(_, value) {
                if (!!value) {
                  setShowFrameLen(true);
                  setFileId(value);
                } else {
                  setShowFrameLen(false);
                }
                return Promise.resolve();
              },
            }),
          ]}
        >

2. 在form item写一些解释性文字

<Form.Item label="网络服务器" required>
    <Space
      direction="vertical"
      style={{
        width: "100%",
      }}
    >
      <Form.Item
        name="networkServerID"
        rules={[
          {
            required: true,
            message: "请选择服务配置文件名称",
          },
        ]}
      >
        <Select
          placeholder="请选择服务配置文件名称"
          options={options}
        />
      </Form.Item>
      <Tooltip>
        <div
          style={{
            color: "#999",
            marginTop: -12,
          }}
        >
          注意：将在其上设置此服务配置文件的网络服务器。创建服务配置文件后，该值不能更改。
        </div>
      </Tooltip>
    </Space>
</Form.Item>

3. form item 属性 dependencies

当字段间存在依赖关系时使用。如果一个字段设置了 dependencies 属性。那么它所依赖的字段更新时，该字段将自动触发更新与校验

<Form.Item
    name="confirm"
    label="Confirm Password"
    dependencies={['password']}
    hasFeedback
    rules={[
      {
        required: true,
        message: 'Please confirm your password!',
      },
      ({ getFieldValue }) => ({
        validator(_, value) {
          if (!value || getFieldValue('password') === value) {
            return Promise.resolve();
          }
          return Promise.reject(new Error('The two passwords that you entered do not match!'));
        },
      }),
    ]}
    >
    <Input.Password />
</Form.Item>

4. antd Form组件Form.item里面下拉选择组件Select异步数据回填的问题。setOption(resOptions)和form.setFieldValue("user", res.data.user)不能同时设置，要定时器设置user的值;

const res = await Promise.all(uploadPromises);
      if (res && res.length) {
        message.success("文件上传成功！");
        const resData = res[0].data.result;
        fileManageStore.getUpgradeFileAll(1, ".bin", (res1) => {
          setOptions(res1.result);
          const cur = res1.result.find((item) => item.id == resData.file_id);
          setTimeout(() => {
            form.setFieldValue("fileId", cur.id);
          }, 300);
        });
      }