(1)概述
这是一个react native的金额格式化组件,基于Text封装而成,同时支持ios和android。
react-native-moneyformattext 点击这里到github,先上图
(2)用法
介绍一下用法:主要是提供一个状态,在state中管理这个状态,当然用mobx或者redux也可以!
1、首先,引用该项目在命令行输入
npm install -save react-native-moneyformattext;
2、在项目中添加引用
import {MoneyFormatText} from "react-native-moneyformattext";
Props
Prop | Type | Optional | Default | Description |
---|---|---|---|---|
text | string | Yes | "" | content of this component |
textColor | color | Yes | '#E51111' | color of text |
style | style | Yes | style for this component | |
bigTextFontSize | number | Yes | 25 | big fontSize for one of these parts in text |
smallTextFontSize | number | Yes | 12 | small fontSize for one of these parts in text |
textStyle | style | Yes | style for text when status!="money" (just normal text) | |
status | string | Yes | "money" | if status="money" show formatted money,else show normal text |
hasRMB | bool | Yes | true | if true,will show RMB |
RMB | string | Yes | "¥" | the symbol of money |
3、在项目中使用
Usage example
import MoneyFormatText from "react-native-moneyformattext";
<MoneyFormatText text="1200000" bigTextFontSize={20} smallTextFontSize={12} hasRMB={true} RMB="$"/>
<MoneyFormatText text="¥1200000" bigTextFontSize={20} smallTextFontSize={12} hasRMB={true}/>
<MoneyFormatText text="¥1200000" bigTextFontSize={20} smallTextFontSize={12} hasRMB={false} RMB="$"/>
<MoneyFormatText text="$1200000" bigTextFontSize={20} smallTextFontSize={12} hasRMB={true} RMB="¥" textColor="red"/>
<MoneyFormatText text="¥1200000" bigTextFontSize={20} smallTextFontSize={12} hasRMB={true} RMB="¥" textColor="black"/>
<MoneyFormatText text="$1200000" bigTextFontSize={20} smallTextFontSize={12} hasRMB={true} RMB="¥"/>
有什么建议和意见欢迎@我
原创博客,欢迎转载!