Oak-Team
/
oak-frontend-base
13
0
Fork 0
Code Issues 2 Pull Requests Packages Projects Releases 37 Wiki Activity

native支持ref 调整withRouter

This commit is contained in:
Wang Kejun 2024-10-16 22:10:14 +08:00
parent fe022c952f
commit 5cba70b566
13 changed files with 15 additions and 198 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
es/page.native.d.ts vendored
View File

@ -6,4 +6,4 @@ import { Feature } from './types/Feature';
import { DataOption, OakComponentOption } from './types/Page';
import { SyncContext } from 'oak-domain/lib/store/SyncRowStore';
import { AsyncContext } from 'oak-domain/lib/store/AsyncRowStore';
export declare function createComponent<IsList extends boolean, ED extends EntityDict & BaseEntityDict, T extends keyof ED, Cxt extends AsyncContext<ED>, FrontCxt extends SyncContext<ED>, AD extends Record<string, Aspect<ED, AsyncContext<ED>>>, FD extends Record<string, Feature>, FormedData extends Record<string, any>, TData extends Record<string, any> = {}, TProperty extends DataOption = {}, TMethod extends Record<string, Function> = {}>(option: OakComponentOption<IsList, ED, T, Cxt, FrontCxt, AD, FD, FormedData, TData, TProperty, TMethod>, features: BasicFeatures<ED> & FD): (props: any) => React.JSX.Element;
export declare function createComponent<IsList extends boolean, ED extends EntityDict & BaseEntityDict, T extends keyof ED, Cxt extends AsyncContext<ED>, FrontCxt extends SyncContext<ED>, AD extends Record<string, Aspect<ED, AsyncContext<ED>>>, FD extends Record<string, Feature>, FormedData extends Record<string, any>, TData extends Record<string, any> = {}, TProperty extends DataOption = {}, TMethod extends Record<string, Function> = {}>(option: OakComponentOption<IsList, ED, T, Cxt, FrontCxt, AD, FD, FormedData, TData, TProperty, TMethod>, features: BasicFeatures<ED> & FD): React.ForwardRefExoticComponent<React.RefAttributes<unknown>>;

2
es/platforms/native/router/withRouter.d.ts vendored
View File

@ -3,5 +3,5 @@ type OakComponentProperties = {
path?: string;
properties?: Record<string, any>;
};
declare const withRouter: (Component: React.ComponentType<any>, { path, properties }: OakComponentProperties) => (props: any) => React.JSX.Element;
declare const withRouter: (Component: React.ComponentType<any>, { path, properties }: OakComponentProperties) => React.ForwardRefExoticComponent<React.RefAttributes<unknown>>;
export default withRouter;

4
es/platforms/native/router/withRouter.js
View File

@ -66,8 +66,8 @@ const withRouter = (Component, { path, properties }) => {
if (path) {
params = Object.assign(params, getParams(routeParams, properties));
}
return <Component {...props} {...params} ref={props.ref} width="xs"/>;
return <Component {...props} {...params} ref={props.forwardedRef} width="xs"/>;
};
return ComponentWithRouterProp;
return React.forwardRef((props, ref) => (<ComponentWithRouterProp {...props} forwardedRef={ref}/>));
};
export default withRouter;

11
lib/components/errorPage/index.d.ts vendored
View File

@ -1,11 +0,0 @@
import { ED } from '../../types/AbstractComponent';
import { ReactComponentProps } from '../../types/Page';
import { ECode } from '../../types/ErrorPage';
declare const _default: <ED2 extends ED, T2 extends keyof ED2>(props: ReactComponentProps<ED2, T2, false, {
code: ECode;
title?: string;
desc?: string;
children?: React.ReactNode;
icon?: React.ReactNode;
}>) => React.ReactElement;
export default _default;

71
lib/components/errorPage/index.js
View File

@ -1,71 +0,0 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const ErrorPage_1 = require("../../types/ErrorPage");
const DefaultErrorInfo = {
[ErrorPage_1.ECode.forbidden]: {
title: '403 Forbidden',
desc: '抱歉，您无权限访问此页面。',
imagePath: './assets/svg/assets-result-403.svg',
},
[ErrorPage_1.ECode.notFound]: {
title: '404 Not Found',
desc: '抱歉，您访问的页面不存在。',
imagePath: './assets/svg/assets-result-404.svg',
},
[ErrorPage_1.ECode.error]: {
title: '500 Internal Server Error',
desc: '抱歉，服务器出错啦！',
imagePath: './assets/svg/assets-result-500.svg',
},
[ErrorPage_1.ECode.networkError]: {
title: '网络异常',
desc: '网络异常，请稍后再试。',
imagePath: './assets/svg/assets-result-network-error.svg',
},
[ErrorPage_1.ECode.maintenance]: {
title: '系统维护中',
desc: '系统维护中，请稍后再试。',
imagePath: './assets/svg/assets-result-maintenance.svg',
},
[ErrorPage_1.ECode.browserIncompatible]: {
title: '浏览器版本低',
desc: '抱歉，您正在使用的浏览器版本过低，无法打开当前网页。',
imagePath: './assets/svg/assets-result-browser-incompatible.svg',
},
};
exports.default = OakComponent({
isList: false,
properties: {
code: '',
title: '',
desc: '',
icon: '', //web独有
imagePath: '', //小程序独有
},
lifetimes: {
ready() {
if (process.env.OAK_PLATFORM === 'wechatMp') {
const { title, desc, code, imagePath } = this.props;
let title2 = title;
if (code) {
this.setState({
desc: desc || DefaultErrorInfo[code].desc,
imagePath: imagePath ||
DefaultErrorInfo[code].imagePath,
});
if (!title2) {
title2 = DefaultErrorInfo[code].title;
}
wx.setNavigationBarTitle({
title: title2,
});
}
}
},
},
methods: {
goBack(delta) {
this.navigateBack(delta);
},
},
});

4
lib/components/func/debugPanel/index.d.ts vendored
View File

@ -1,4 +0,0 @@
/// <reference types="wechat-miniprogram" />
/// <reference types="react" />
declare const _default: (props: import("../../..").ReactComponentProps<import("oak-domain/lib/types").EntityDict & import("oak-domain/lib/base-app-domain").EntityDict, string | number, true, WechatMiniprogram.Component.DataOption>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
export default _default;

67
lib/components/func/debugPanel/index.js
View File

@ -1,67 +0,0 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.default = OakComponent({
isList: true,
data: {
visible: false,
dialogVisible: false,
},
methods: {
async printDebugStore(e) {
const fullData = await this.features.cache.getFullData();
console.log(fullData);
},
printCachedStore() {
console.log(this.features.cache.getCachedData());
},
printRunningTree() {
console.log(this.features.runningTree.getRoot());
},
async resetInitialData() {
await this.features.localStorage.clear();
},
setVisible(visible) {
this.setState({
visible,
});
},
handlePopup() {
this.setVisible(true);
},
handlePopupClose() {
// this.setVisible(false);
},
//小程序重置
handleReset() {
this.resetInitialData();
const pages = getCurrentPages(); //获取加载的页面
const currentPage = pages[pages.length - 1]; //获取当前页面的对象
const url = currentPage.route; //当前页面url
const options = currentPage.options; //如果要获取url中所带的参数可以查看options
this.redirectTo({
url: url
.replace('/pages', '')
.replace('pages', '')
.replace('/index', ''),
}, options);
this.closeDialog();
},
showDialog() {
this.setState({
dialogVisible: true,
});
},
closeDialog() {
this.setState({
dialogVisible: false,
});
},
async downloadEnv() {
const data = await this.features.localStorage.loadAll();
return data;
},
async resetEnv(data) {
await this.features.localStorage.resetAll(data);
},
},
});

5
lib/components/message/index.d.ts vendored
View File

@ -1,5 +0,0 @@
/// <reference types="react" />
declare const _default: (props: import("../..").ReactComponentProps<import("oak-domain/lib/types").EntityDict & import("oak-domain/lib/base-app-domain").EntityDict, string | number, false, {
key: string;
}>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
export default _default;

30
lib/components/message/index.js
View File

@ -1,30 +0,0 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.default = OakComponent({
isList: false,
formData({ props }) {
const data = this.consumeMessage();
if (data) {
if (process.env.OAK_PLATFORM === 'wechatMp') {
// lin-ui的message: https://doc.mini.talelin.com/component/response/message.html
const type = !data.type || data.type === 'info' ? 'primary' : data.type;
wx.lin.showMessage({
type: type,
content: data.content,
icon: data.icon,
duration: data.duration,
top: data.offset,
});
return {};
}
return {
data,
};
}
return {};
},
features: ['message'],
properties: {
key: ''
}
});

3
lib/page.native.d.ts vendored
View File

@ -1,3 +1,4 @@
import React from 'react';
import { Aspect, EntityDict } from 'oak-domain/lib/types';
import { EntityDict as BaseEntityDict } from 'oak-domain/lib/base-app-domain';
import { BasicFeatures } from './features';
@ -5,4 +6,4 @@ import { Feature } from './types/Feature';
import { DataOption, OakComponentOption } from './types/Page';
import { SyncContext } from 'oak-domain/lib/store/SyncRowStore';
import { AsyncContext } from 'oak-domain/lib/store/AsyncRowStore';
export declare function createComponent<IsList extends boolean, ED extends EntityDict & BaseEntityDict, T extends keyof ED, Cxt extends AsyncContext<ED>, FrontCxt extends SyncContext<ED>, AD extends Record<string, Aspect<ED, AsyncContext<ED>>>, FD extends Record<string, Feature>, FormedData extends Record<string, any>, TData extends Record<string, any> = {}, TProperty extends DataOption = {}, TMethod extends Record<string, Function> = {}>(option: OakComponentOption<IsList, ED, T, Cxt, FrontCxt, AD, FD, FormedData, TData, TProperty, TMethod>, features: BasicFeatures<ED> & FD): (props: any) => import("react/jsx-runtime").JSX.Element;
export declare function createComponent<IsList extends boolean, ED extends EntityDict & BaseEntityDict, T extends keyof ED, Cxt extends AsyncContext<ED>, FrontCxt extends SyncContext<ED>, AD extends Record<string, Aspect<ED, AsyncContext<ED>>>, FD extends Record<string, Feature>, FormedData extends Record<string, any>, TData extends Record<string, any> = {}, TProperty extends DataOption = {}, TMethod extends Record<string, Function> = {}>(option: OakComponentOption<IsList, ED, T, Cxt, FrontCxt, AD, FD, FormedData, TData, TProperty, TMethod>, features: BasicFeatures<ED> & FD): React.ForwardRefExoticComponent<React.RefAttributes<unknown>>;

2
lib/platforms/native/router/withRouter.d.ts vendored
View File

@ -3,5 +3,5 @@ type OakComponentProperties = {
path?: string;
properties?: Record<string, any>;
};
declare const withRouter: (Component: React.ComponentType<any>, { path, properties }: OakComponentProperties) => (props: any) => import("react/jsx-runtime").JSX.Element;
declare const withRouter: (Component: React.ComponentType<any>, { path, properties }: OakComponentProperties) => React.ForwardRefExoticComponent<React.RefAttributes<unknown>>;
export default withRouter;

6
lib/platforms/native/router/withRouter.js
View File

@ -1,6 +1,8 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = tslib_1.__importDefault(require("react"));
const assert_1 = require("oak-domain/lib/utils/assert");
function getParams(params, properties) {
const props = getProps(params, properties);
@ -68,8 +70,8 @@ const withRouter = (Component, { path, properties }) => {
if (path) {
params = Object.assign(params, getParams(routeParams, properties));
}
return (0, jsx_runtime_1.jsx)(Component, { ...props, ...params, ref: props.ref, width: "xs" });
return (0, jsx_runtime_1.jsx)(Component, { ...props, ...params, ref: props.forwardedRef, width: "xs" });
};
return ComponentWithRouterProp;
return react_1.default.forwardRef((props, ref) => ((0, jsx_runtime_1.jsx)(ComponentWithRouterProp, { ...props, forwardedRef: ref })));
};
exports.default = withRouter;

6
src/platforms/native/router/withRouter.tsx
View File

@ -94,9 +94,11 @@ const withRouter = (
params = Object.assign(params, getParams(routeParams, properties));
}
return <Component {...props} {...params} ref={props.ref} width="xs" />;
return <Component {...props} {...params} ref={props.forwardedRef} width="xs" />;
};
return ComponentWithRouterProp;
return React.forwardRef((props, ref) => (
<ComponentWithRouterProp {...props} forwardedRef={ref} />
));
};
export default withRouter;