以本机方式创建对象

时间:2018-05-23 14:46:30

标签: react-native

我正在尝试将noteText保存在文本中,但这已经成为一个问题。我想创建一个具有相同属性的对象:名称,日期,注释,并仅显示名称和日期。此外,我想,当我创建一个Note来将其映射到数组中时。像这样

let notes = this.state.noteArray.map((val, key)=>{
        return <Note key={key} keyval={key} val={val}
                deleteMethod={()=>this.deleteNote(key)} openNote={()=>this.openNote(key)}/>
    });

以下是我添加项目的方式:

this.props.navigation.state.params.noteArray.push({
                'noteNumber':'Note '+ this.props.navigation.state.params.noteArray[key],
                'date':d.getFullYear()+
                "/"+(d.getMonth()+1) +
                "/"+ d.getDate(),
                'note': this.state.noteText
            });

以下是课堂笔记:

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


export default class Note extends Component {
render() {
    return (
        <TouchableWithoutFeedback key={this.props.keyval}  onPress={this.props.openNote}>
            <View style={styles.note}>
                <Text style={styles.noteDate}>{this.props.val.noteNumber}</Text>
                <Text style={styles.noteDate}>{this.props.val.date}</Text>
                <Text style={styles.noteText}>{this.props.val.note}</Text>

                <TouchableOpacity onPress={this.props.deleteMethod} style={styles.noteDelete}>
                    <Text style={styles.noteDeleteText}>Del</Text>
                </TouchableOpacity>

            </View>
        </TouchableWithoutFeedback>
    );
}
}


const styles = StyleSheet.create({
note: {
    position: 'relative',
    padding: 20,
    backgroundColor:'#fff',
    paddingRight: 100,
    borderLeftWidth:1,
    borderLeftColor: '#000',
    borderRightWidth:1,
    borderRightColor: '#000',
    borderBottomWidth:1,
    borderBottomColor: '#000'
},
noteDate:{
    paddingLeft: 20,
    borderLeftWidth: 10,
    borderLeftColor: '#0000FF'
},
noteText: {
    paddingLeft: 20,
    borderLeftWidth: 10,
    borderLeftColor: '#0000FF',
    opacity: 0,
},
noteDelete: {
    position: 'absolute',
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#2980b9',
    padding: 10,
    top: 10,
    bottom: 10,
    right: 10
},
noteDeleteText: {
    color: 'white'
},
});

1 个答案:

答案 0 :(得分:0)

这是我工作的例子:

import React, { Component } from "react";

class Counter extends Component {
 state = { counter: this.props.startsWith };

 ...
}

我代替Counter使用Note本身。