30 lines
1021 B
TypeScript
30 lines
1021 B
TypeScript
import LottieView from 'lottie-react-native';
|
|
import React from 'react';
|
|
import { StyleProp, ViewStyle } from 'react-native';
|
|
|
|
// welcome.native.tsx
|
|
export default function NativeLottie(props: { source: string, style?: StyleProp<ViewStyle>, loop?: boolean }) {
|
|
const { source, style, loop } = props;
|
|
|
|
// require() 的参数需要是静态字符串，不能使用变量。要实现动态加载 JSON 文件，使用 switch 或对象映射
|
|
const getAnimationSource = () => {
|
|
switch (source) {
|
|
case 'allDone':
|
|
return require('@/assets/json/AllDone.json');
|
|
case 'welcome':
|
|
return require('@/assets/json/welcome.json');
|
|
// 添加其他需要的 JSON 文件
|
|
default:
|
|
return require('@/assets/json/welcome.json'); // 默认文件
|
|
}
|
|
};
|
|
|
|
return (
|
|
<LottieView
|
|
autoPlay
|
|
style={style}
|
|
loop={loop}
|
|
source={getAnimationSource()}
|
|
/>
|
|
);
|
|
} |