jdyfe-test

jmr-text

a text node component

Features

• 可控制文字显示行数。
• 只显示1行文字时，默认不显示省略号。因为手机屏幕上的文字容器宽度通常都很小，省略号会占用过多的显示宽度。

Installation

npm i -S @jmfe/jmr-text

Usage

import React from 'react';
import ReactDOM from 'react-dom';
import '@jmfe/jmr-text';

ReactDOM.render(
  <div>
    <Text />
  </div>,
  container
);

API

Name	Type	Default	Description
prefixCls	string	'jmr-text'	设置组件根节点及子节点的class前缀
className	string		为组件根DOM节点添加class
numberOfLines	number		设置文字显示行数，超出部分用...代替（e.g. 1、2、3）
style	object	{ border: '0 solid black', position: 'relative', boxSizing: 'border-box', flexDirection: 'column', alignContent: 'flex-start', flexShrink: 0, fontSize: 12 }	设置根节点内联样式，可重写默认值

其次，jmr-text针对小字体在移动设备上偏移问题，做了适配，使得安卓机器和苹果手机不居中的问题得到解决。 详细问题描述参考cf文档：https://cf.jd.com/pages/viewpage.action?pageId=134824812 props type value needed isVerticalMiddle | type:boolean | value:true | required pixel | type:number | value:8/9/10/11 | required

isVerticalMiddle不传或者false,默认原有组件，传isVerticalMiddle为true必传pixel的值，同时小字体时，组件样式可以通过在组件里写className或者style，覆盖组件样式。

Development

npm install
npm start

Examples

npm start and then go to http://localhost:8080

License

MIT

Todos

增加参数，实现垂直居中，参考cf地址：https://cf.jd.com/pages/viewpage.action?pageId=134824812 通常情况下字体去掉。 加判断设置了开关，必须传px和 fontSize pixel