第一步,下载依赖

npm install react-native-htmlview --save

npm install react-native-easy-toast --save

第二步,引入

import Toast, {DURATION} from 'react-native-easy-toast'
import HTMLView from 'react-native-htmlview';

第三步,使用

export default class App extends Component{
render(){
const htmlContent = `<p><a href="https://www.cnblogs.com/ldlx-mars/p/9360650.html">火星黑洞</a></p>`;
return(
<View>
<Text onPress={()=>{this.refs.toast.show('hello world!',500)}}>我是首页</Text>
<Toast ref="toast" position='center' opacity={.8}/>
<HTMLView
value={htmlContent}
stylesheet={styles}
/>
</View>
)
}
}

然后执行项目

完整代码是,app.js

import React, { Component } from 'react';
import { StyleSheet,View,Text } from 'react-native';
import Toast, {DURATION} from 'react-native-easy-toast'
import HTMLView from 'react-native-htmlview';
export default class App extends Component{
render(){
const htmlContent = `<p><a href="https://www.cnblogs.com/ldlx-mars/p/9360650.html">火星黑洞</a></p>`;
return(
<View>
<Text onPress={()=>{this.refs.toast.show('hello world!',500)}}>我是首页</Text>
<Toast ref="toast" position='center' opacity={.8}/>
<HTMLView
value={htmlContent}
stylesheet={styles}
/>
</View>
)
}
} const styles = StyleSheet.create({
a: {
fontWeight: '300',
color: '#FF3366',
},
});

react native中使用 react-native-easy-toast 和react-native-htmlview的更多相关文章

  1. React Native 中 CSS 的使用

    首先声明,此文原作者为黎 跃春 React Native中CSS 内联样式 对象样式 使用Stylesheet.Create 样式拼接 导出样式对象 下面的代码是index.ios.js中的代码: / ...

  2. react native中的欢迎页(解决首加载白屏)

    参照网页: http://blog.csdn.net/fengyuzhengfan/article/details/52712829 首先是在原生中写一些方法,然后通过react native中js去 ...

  3. React Native中的网络请求fetch和简单封装

    React Native中的网络请求fetch使用方法最为简单,但却可以实现大多数的网络请求,需要了解更多的可以访问: https://segmentfault.com/a/1190000003810 ...

  4. [转] 「指尖上的魔法」 - 谈谈 React Native 中的手势

    http://gold.xitu.io/entry/55fa202960b28497519db23f React-Native是一款由Facebook开发并开源的框架,主要卖点是使用JavaScrip ...

  5. [转] 在React Native中使用ART

    http://bbs.reactnative.cn/topic/306/%E5%9C%A8react-native%E4%B8%AD%E4%BD%BF%E7%94%A8art 前半个月捣腾了一下Rea ...

  6. react native中使用echarts

    开发平台:mac pro node版本:v8.11.2 npm版本:6.4.1 react-native版本:0.57.8 native-echarts版本:^0.5.0 目标平台:android端收 ...

  7. react native中一次错误排查 Error:Error: Duplicate resources

    最近一直在使用react native中,遇到了很多的坑,同时也学习到了一些移动端的开发经验. 今天在做一个打包的测试时,遇到了一个问题,打包过程中报错“Error:Error: Duplicate ...

  8. 在React Native中,使用fetch网络请求 实现get 和 post

    //在React Native中,使用fetch实现网络请求 /* fetch 是一个封装程度更高的网络API, 使用了Promise * Promise 是异步编程的一种解决方案 * Promise ...

  9. 《React Native 精解与实战》书籍连载「React Native 中的生命周期」

    此文是我的出版书籍<React Native 精解与实战>连载分享,此书由机械工业出版社出版,书中详解了 React Native 框架底层原理.React Native 组件布局.组件与 ...

  10. react native中如何往服务器上传网络图片

    let common_url = 'http://192.168.1.1:8080/'; //服务器地址 let token = ''; //用户登陆后返回的token /** * 使用fetch实现 ...

随机推荐

  1. LeetCode 11 - 盛最多水的容器 - [双指针暴力]

    题目链接:https://leetcode-cn.com/problems/container-with-most-water/description/ 给定 n 个非负整数 $a_1,a_2,\cd ...

  2. [No000013C]B树、B-树、B+树、B*树

    B树 即二叉搜索树: 1.所有非叶子结点至多拥有两个儿子(Left和Right): 2.所有结点存储一个关键字: 3.非叶子结点的左指针指向小于其关键字的子树,右指针指向大于其关键字的子树: 如: B ...

  3. [No000012F]WPF(7/7) - 样式,触发器和动画

    WPF Tutorial : Beginning [^] WPF Tutorial : Layout-Panels-Containers & Layout Transformation [^] ...

  4. ROADS POJ - 1724 约束最短路 暴搜 加剪枝

    http://poj.org/problem?id=1724 题意:最短路的模板,不过每条边加上一个费用,要求总费用不超过k 题解:不能用dijkstra ,直接暴力,dfs维护len和cost. 普 ...

  5. 【作业】用栈模拟dfs

    题意:一个迷宫,起点到终点的路径,不用递归. 题解: #define _CRT_SECURE_NO_WARNINGS #include<stdio.h> #include<stdli ...

  6. [daily][archlinux][game] 几个linux下还不错的游戏

    春节在家放松, 装了几个游戏在archlinux上,玩起来还不错. 假期结束开工了, 玩的时间也会比较少,准备删掉, 记录如下: 1. 0ad 即时战略类, 类似于冷兵器时代的红警. 画面还不错, 可 ...

  7. [troubleshoot][archliunx][chromium][flash] chrome提示flash不是最新

    最近chrome总是在提示flash不是最新要求更新. 原来以前用的flash包 chromium-pepper-flash 不见了,改名变成了pepper-flash. /home/tong [to ...

  8. 斜率优化&单调性优化的相似性

    写了一道单调性优化发现 跟斜率优化很像,而且这道题目感觉质量非常的好. 其实斜率优化是基于单调性优化的,但是面对这道题 我竟然连单调性优化都不太会,尽管这个模型非常不好理解. 对于每道题 我都会打一个 ...

  9. LeetCode 657 Robot Return to Origin 解题报告

    题目要求 There is a robot starting at position (0, 0), the origin, on a 2D plane. Given a sequence of it ...

  10. 【Python】脚本运行报错:IndentationError: unindent does not match any outer indentation level

    [问题] 一个python脚本,本来都运行好好的,然后写了几行代码,而且也都确保每行都对齐了,但是运行的时候,却出现语法错误: IndentationError: unindent does not ...