{"id":4420,"url":"https://github.com/osdio/react-native-html-render","last_synced_at":"2025-08-04T01:32:19.215Z","repository":{"id":34766602,"uuid":"38748593","full_name":"osdio/react-native-html-render","owner":"osdio","description":"A html render for react-native","archived":true,"fork":false,"pushed_at":"2020-10-04T08:13:16.000Z","size":92,"stargazers_count":102,"open_issues_count":24,"forks_count":49,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-07-29T10:56:33.603Z","etag":null,"topics":["noder","react","react-native"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/osdio.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-07-08T10:53:56.000Z","updated_at":"2025-03-14T03:03:56.000Z","dependencies_parsed_at":"2022-09-15T06:22:06.446Z","dependency_job_id":null,"html_url":"https://github.com/osdio/react-native-html-render","commit_stats":null,"previous_names":["soliury/react-native-html-render"],"tags_count":5,"template":false,"template_full_name":null,"purl":"pkg:github/osdio/react-native-html-render","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/osdio%2Freact-native-html-render","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/osdio%2Freact-native-html-render/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/osdio%2Freact-native-html-render/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/osdio%2Freact-native-html-render/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/osdio","download_url":"https://codeload.github.com/osdio/react-native-html-render/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/osdio%2Freact-native-html-render/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":268636332,"owners_count":24282077,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-08-03T02:00:12.545Z","response_time":2577,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["noder","react","react-native"],"created_at":"2024-01-05T20:17:11.361Z","updated_at":"2025-08-04T01:32:18.919Z","avatar_url":"https://github.com/osdio.png","language":"JavaScript","readme":"# react-native-html-render\n\u003e A html render for react-native. But don't **Suitable for** all html. Only **Suitable for** the html generator by markdown with minify.\n\u003e\n\u003e Now it used by [Noder](https://github.com/soliury/noder-react-native).\n\u003e\n\u003e Be careful to use, the performance is not good. If you want to improve the performance, be free to open a issue or send a PR.\n\n\n## Install\n\n```\nnpm install react-native-html-render\n```\n\n## Futures\n\n* Support img and code render.\n* Can set custom render function and styles.\n* More beautiful native View.\n\n## Demo\n\n![noder-demo](http://7lrzfj.com1.z0.glb.clouddn.com/soliurynoder-html-render.gif)\n\n## Example\n\n``` javascript\nvar React = require('react-native')\nvar HtmlRender = require('react-native-html-render')\n\nvar {\n    Component,\n    View,\n    Text,\n    StyleSheet,\n    Image\n    }=React\n\nvar styles = StyleSheet.create({\n    img: {\n        width: 100,\n        height: 100\n    }\n})\n\n\nclass HtmlContent extends Component {\n\n    _renderNode(node, index, parent, type) {\n      //Your code here\n    }\n\n    render() {\n      const sample = \"\u003cH5\u003eHello World\u003c/H5\u003e\";\n        return (\n            \u003cHtmlRender\n                value={{sample}}\n                stylesheet={styles}\n                renderNode={this._renderNode}\n                /\u003e\n        )\n    }\n\n}\n\nmodule.exports = HtmlContent\n```\n\n## API\n\n### `value`\n\nThe value of html content.\n\n### `stylesheet`\n\nCustom styles\n\n### `onLinkPress`\n\nHandle the link click event.\n\n### `renderNode`\n\nCustom render function.\n\nThe render function has three arguments.\n\n**node**: A Object show the node of html.\n\nStruct:\n\n```\n{\n    name:'text',\n    text: String,\n    parent: Object,\n    type: String\n}\n\nor If the node is not a text node:\n\n{\n    name: String,\n    attribs: Object,\n    type: String,\n    parent: Object\n}\n\n```\n\n**index**: The index of the node in the parent node.\n\n**parent**: The parent of the node.\n\n**type**: Only two types: `block` or `inline`.\n\nMor details:\n\n```\n\nvar blockTagArr = ['div', 'p', 'img', 'address',\n    'blockquote', 'dir', 'dl',\n    'form', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6',\n    'menu', 'ol', 'pre', 'table', 'ul', 'li', 'hr']\n\nvar inlineTagArr = ['a', 'abbr', 'b', 'big',\n    'br', 'cite', 'code', 'em', 'label', 'span', 'strong']\n\n```\n\n## FAQ\n\nMore details see [Noder](https://github.com/soliury/noder-react-native).\n\n## Licenses\n\n[MIT](https://opensource.org/licenses/MIT)\n","funding_links":[],"categories":["Components"],"sub_categories":["Text \u0026 Rich Content"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fosdio%2Freact-native-html-render","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fosdio%2Freact-native-html-render","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fosdio%2Freact-native-html-render/lists"}