• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

lwansbrough/react-native-markdown: Markdown component for React Native

原作者: [db:作者] 来自: 网络 收藏 邀请

开源软件名称(OpenSource Name):

lwansbrough/react-native-markdown

开源软件地址(OpenSource Url):

https://github.com/lwansbrough/react-native-markdown

开源编程语言(OpenSource Language):

JavaScript 100.0%

开源软件介绍(OpenSource Introduction):

react-native-markdown

A component for rendering Markdown in React Native. Pull requests welcome.

Known issues

  • Due to a bug in underlying layout engine for React Native (facebook/css-layout), this module will put your application in an infinite loop unless you patch the upstream changes from css-layout's' Layout.c and Layout.h files.

Getting started

  1. npm install react-native-markdown --save

Usage

All you need is to require the react-native-markdown module and then use the <Markdown/> tag.

var React = require('react-native');
var {
  AppRegistry,
  StyleSheet,
  View
} = React;
var Markdown = require('react-native-markdown');

var mdApp = React.createClass({
  render: function() {
    return (
      <View>
        <Markdown>
          Some *really* basic **Markdown**.
          {'\n\n'}
          | # | Name   | Age |{'\n'}
          |---|--------|-----|{'\n'}
          | 1 | John   | 19  |{'\n'}
          | 2 | Sally  | 18  |{'\n'}
          | 3 | Stream | 20  |{'\n'}
        </Markdown>
      </View>
    );
  }
});

AppRegistry.registerComponent('mdApp', () => mdApp);

Properties

style

Default style properties will be applied to the markdown. You will likely want to customize these styles, the following properties can be used to modify the rendered elements:

Note: The text inside the parentheses denotes the element type.

  • autolink (<Text>) - WIP
  • blockQuote (<Text>) - WIP
  • br (<Text>)
  • codeBlock (<View>) - WIP
  • del (<Text>)
  • em (<Text>)
  • heading (<Text>) - Also heading1 through heading6
  • hr (<View>)
  • image (<Image>) - Implemented but size is fixed to 50x50 until auto width is supported by React Native.
  • inlineCode (<Text>)
  • link (<Text>) - WIP
  • list (<View>) - Also listItem (<View>), listItemBullet (<Text>) and listItemNumber (<Text>)
  • mailto (<Text>) - WIP
  • newline (<Text>) - WIP
  • paragraph (<View>)
  • plainText (<Text>) - Use for styling text without any associated styles
  • strong (<Text>)
  • table (<View>)
  • tableHeader (<View>)
  • tableHeaderCell (<Text>)
  • tableRow (<View>)
  • tableRowCell (<View>)
  • tableRowLast (<View>, inherits from tableRow)
  • text (<Text>) - Inherited by all text based elements
  • u (<View>)
  • url (<Text>)
  • view (<View>) - This is the container View that the Markdown is rendered in.



鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap