• react native中使用 react-native-easy-toast 和react-native-htmlview


    第一步,下载依赖

    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',
        },
    });
  • 相关阅读:
    常用查看日志的命令
    通过maven profile配置不同开发环境
    java使用shiro小记
    gitlab使用小记
    java使用guava变形数据结构
    php 把驼峰样式的字符串转换成下划线样式的字符串
    tcp粘包和拆包的处理方案
    php和js中,utf-8编码转成base64编码
    yum的用法
    rpm的用法
  • 原文地址:https://www.cnblogs.com/ldlx-mars/p/9361006.html
Copyright © 2020-2023  润新知