React-nativeのポップアップ・ウィンドウ・ヒント・コンポーネント
2539 ワード
開発中にネットワーク要求エラーが発生した時に統一的なインタフェースを提供し、Reduxとパッケージ化されたコンポーネントを結合し、処理しやすい.このコンポーネントはiReadingとredditのappで使用されたことがあり、比較的簡単にireadingコードを直接参照することができる.
github:react-native-root-toast
インストールにはこのコンポーネントが必要です
github:react-native-root-toast
インストールにはこのコンポーネントが必要です
./app/utils/ToastUtils.js
import {
Platform
} from 'react-native';
import Toast from 'react-native-root-toast';//
let toast;
//
export const toastShort = (content) => {
if (toast !== undefined) {
Toast.hide(toast);
}
toast = Toast.show(content.toString(), {
duration: Toast.durations.SHORT,
position: Platform.OS === 'android' ? Toast.positions.BOTTOM : Toast.positions.CENTER,
shadow: true,
animation: true,
hideOnPress: true,
delay: 0
});
};
//
export const toastLong = (content) => {
if (toast !== undefined) {
Toast.hide(toast);
}
toast = Toast.show(content.toString(), {
duration: Toast.durations.LONG,
position: Platform.OS === 'android' ? Toast.positions.BOTTOM : Toast.positions.CENTER,
shadow: true,
animation: true,
hideOnPress: true,
delay: 0
});
};
ireading redux-saga ， saga . redux-saga actions ,reddit . ireading redux-thunk .
./app/sagas/read.js
import { toastShort } from '../utils/ToastUtil';// toast
import { request } from '../utils/RequestUtil';
import { WEXIN_ARTICLE_LIST } from '../constants/Urls';
import { fetchArticleList, receiveArticleList } from '../actions/read';
export function* requestArticleList(isRefreshing, loading, typeId, isLoadMore, page) {
try {
yield put(fetchArticleList(isRefreshing, loading, isLoadMore));
const articleList = yield call(request,
`${WEXIN_ARTICLE_LIST}?typeId=${typeId}&page=${page}`,
'get');
yield put(receiveArticleList(articleList.showapi_res_body.pagebean.contentlist, typeId));
const errorMessage = articleList.showapi_res_error;
if (errorMessage && errorMessage !== '') {
yield toastShort(errorMessage); //
}
} catch (error) {
yield put(receiveArticleList([], typeId));
toastShort(' ， ');//
}
}
は、コンポーネントgithubの を て
Toast
が きすぎてgifはまだ きさを える が からない.
の の