react-native触摸组件TouchableOpacity

效果图

react-native触摸组件TouchableOpacity_第1张图片

代码示例

import React, { Component } from 'react';
import {
    StyleSheet,
    View,
    Text,
    TouchableOpacity,
    Alert
} from 'react-native';

type Props = {};
export default class TouchableOpacityPage extends Component {
    render() {
        return(
            
                 {
                    Alert.alert("点击了Text");
                }}>
                    TouchableOpacity组件用于封装视图,使其可以正确响应触摸操作。当按下的时候,封装的视图的不透明度会降低。
                
                 {
                    Alert.alert("点击弹窗");
                }}>
                    
                        点击
                    
                
                
                    
                        搜索
                    
                
            
        );
    }
}

const searchClick = () => {
    Alert.alert("点击搜索");
};

const styles = StyleSheet.create({
    viewContainer: {
        margin:20,
        backgroundColor:"#D8BFD8",
    },
    textStyle: {
        margin:10,
        color:'red',
    }
});

你可能感兴趣的:(react-native学习)