fix: tabbarItem组件自定义名称统一为className字段

src/packages/tabbar/doc.en-US.md

@@ -182,7 +182,8 @@ export default App;
 | href | Jump link of tab page; if `to` exists at the same time, it takes precedence over to | String | -- |
 | to | The route object of the tab, equal to React Router's [to Prop](https://v5.reactrouter.com/web/api/Link/to-string) Prop | any | -- |
 | num | The numerical corner mark in the upper right corner of the tab, if it exceeds 99, it will be 99+ | Number | -- |
-| classPrefix | 自Custom icon class name prefix for using custom icons | String | 'nut-icon' |
+| iconClassPrefix`v1.2.1` | Custom icon class name prefix, used to use custom icons | String | `nut-icon` |
+| iconFontClassName`v1.2.1` | Basic class name of custom icon font | String | `nutui-iconfont` |
 | dot | Whether to display the little red dot in the upper right corner of the icon | Boolean | false |
 
 

src/packages/tabbar/doc.md

@@ -179,10 +179,10 @@ export default App;
 | href | 标签页的跳转链接；如果同时存在 `to`，优先级高于 to | String | -- |
 | to | 标签页的路由对象，等于 React Router 的 [to 属性](https://v5.reactrouter.com/web/api/Link/to-string) 属性 | any | -- |
 | num | 页签右上角的数字角标，超出99之后为99+ | Number | -- |
-| classPrefix`v1.2.2` | 自定义icon 类名前缀，用于使用自定义图标 | String | 'nut-icon' |
+| iconClassPrefix`v1.2.1` | 自定义 icon 类名前缀，用于使用自定义图标 | String | `nut-icon` |
+| iconFontClassName`v1.2.1` | 自定义 icon 字体基础类名 | String | `nutui-iconfont` |
 | dot`v1.2.2` | 是否显示图标右上角小红点 | Boolean | false |
 
-
 ### Event
 
 | 事件名称 | 说明 | 回调参数 |

src/packages/tabbar/doc.zh-TW.md

@@ -182,7 +182,8 @@ export default App;
 | href | 標籤頁的跳轉鏈接；如果同時存在 `to`，優先級高於 to | String | -- |
 | to | 標籤頁的路由對象，等於 React Router 的 [to 屬性](https://v5.reactrouter.com/web/api/Link/to-string) 屬性 | any | -- |
 | num | 頁簽右上角的數字角標，超出99之後為99+ | Number | -- |
-| classPrefix | 自定義icon 類名前綴，用於使用自定義圖標 | String | 'nut-icon' |
+| iconClassPrefix`v1.2.1` | 自定義 icon 類名前綴，用於使用自定義圖標 | String | `nut-icon` |
+| iconFontClassName`v1.2.1` | 自定義 icon 字體基礎類名 | String | 
 | dot | 是否顯示圖標右上角小紅點 | Boolean | false |
 
 

src/packages/tabbaritem/tabbaritem.taro.tsx

@@ -9,7 +9,7 @@ import { IComponent, ComponentDefaults } from '@/utils/typings'
 export interface TabbarItemProps extends IComponent {
  dot: boolean
  size: string | number
- classPrefix: string
+ className: string
  tabTitle: string
  icon: string
  href: string
@@ -26,7 +26,7 @@ const defaultProps = {
  ...ComponentDefaults,
  dot: false,
  size: '',
- classPrefix: 'nutui-iconfont',
+ className: '',
  tabTitle: '',
  icon: '',
  href: '',
@@ -45,7 +45,8 @@ export const TabbarItem: FunctionComponent<Partial<TabbarItemProps>> = (
  const {
  dot,
  size,
- classPrefix,
+ className,
+ style,
  tabTitle,
  icon,
  href,
@@ -78,8 +79,9 @@ export const TabbarItem: FunctionComponent<Partial<TabbarItemProps>> = (
 
  return (
  <div
- className={`${b({ active })}`}
+ className={`${b({ active })} ${className}`}
  style={{
+ ...style,
  color: active ? activeColor : unactiveColor,
  }}
  onClick={() => {

src/packages/tabbaritem/tabbaritem.tsx

@@ -9,7 +9,7 @@ import { IComponent, ComponentDefaults } from '@/utils/typings'
 export interface TabbarItemProps extends IComponent {
  dot: boolean
  size: string | number
- classPrefix: string
+ className: string
  tabTitle: string
  icon: string
  href: string
@@ -26,7 +26,7 @@ const defaultProps = {
  ...ComponentDefaults,
  dot: false,
  size: '',
- classPrefix: 'nut-icon',
+ className: '',
  tabTitle: '',
  icon: '',
  href: '',
@@ -45,7 +45,8 @@ export const TabbarItem: FunctionComponent<Partial<TabbarItemProps>> = (
  const {
  dot,
  size,
- classPrefix,
+ className,
+ style,
  tabTitle,
  icon,
  href,
@@ -78,8 +79,9 @@ export const TabbarItem: FunctionComponent<Partial<TabbarItemProps>> = (
 
  return (
  <div
- className={`${b({ active })}`}
+ className={`${b({ active })} ${className}`}
  style={{
+ ...style,
  color: active ? activeColor : unactiveColor,
  }}
  onClick={() => {