鱼皮接口项目（2）遇到的一些问题的解决方法

问题1：登录后遇到报错，界面配置不生效的问题

问题出现的原因：应该是 src/app.tsx 中使用到了 settings 属性，但鱼皮修改时删掉了原来的 settings 属性

解决方法：在项目初始化后原始的文件上进行修改

将 src/app.tsx 中的 getInitialState() 修改成

export async function getInitialState(): Promise<{

settings?: Partial<LayoutSettings>;

loginUser?: API.UserVO;

loading?: boolean;

fetchUserInfo?: () => Promise<API.UserVO | undefined>;

}> {

const fetchUserInfo = async () => {

try {

const res = await getLoginUserUsingGET({

skipErrorHandler: true,

});

return res.data;

} catch (error) {

history.push(loginPath);

}

return undefined;

};

// 如果不是登录页面，执行

if (window.location.pathname !== loginPath) {

const loginUser = await fetchUserInfo();

return {

fetchUserInfo,

loginUser,

settings: defaultSettings,

};

}

return {

fetchUserInfo,

settings: defaultSettings,

};

}

src/pages/User/Login/index.tsx 中这部分代码也要修改一下，一样是在项目初始化后原始的文件上修改

问题2：前端接口管理修改失败

问题出现的原因：前端没有传递 id 给后端

解决方法1：

在前端 src/pages/InterfaceInfo/components/UpdateModal.tsx 中传递 id（思路来自球友：啵啵肠）

前端 src/pages/InterfaceInfo/index.tsx 的const [currentRow, setCurrentRow] = useState<API.RuleListItem>(); 中的currentRow保存了当前行的数据，我们给UpdateModal 组件传递了 values 属性，values 属性有值时其值就是当前行的数据，这样我们可以在 src/pages/InterfaceInfo/components/UpdateModal.tsx 中从传递过来的 values 属性中取到当前行 id

解决方法2：鱼皮接口项目（3）中鱼皮的做法

在 src/pages/Admin/InterfaceInfo/index.tsx 中

先修改类型

然后

问题3：控制台的报错

报错1：点击新建或者修改时会出现以下报错

报错原因：key 重复了

解决方法：将其中一个 key 进行修改

报错2：进入接口管理页时控制台会出现以下报错

报错原因：Ant Design 这些组件的 visible 属性将在下一个主版本中删除需要使用 open 代替

解决方法：将这些组件的 visible 属性修改成 open 属性

在 src/pages/InterfaceInfo/index.tsx 中修改

在 src/pages/InterfaceInfo/components/CreateModal.tsx 中修改

在 src/pages/InterfaceInfo/components/UpdateModal.tsx 中修改