React Native help

[sliit_kolla]

react native වල props හා state වලින් වෙන එක example එකක් එක්ක කියල දෙනවද දන්න කෙනෙක් ..තේරෙන්නෙම නෑ බං

 

[gihan798114]

props contains information set by the parent component (although defaults can be set) and should not be changed.

state contains “private” information for the component to initialise, change, and use on it’s own.

props are a way of passing data from parent to child. ... State is reserved only for interactivity, that is, data that changes over time.

Props

class Hello extends React.Component<Props, any> {
render() {
return <h1>Hello from {this.props.name}!</h1>;
}
}

// invoke the component by passing props
ReactDOM.render(
<Hello name="Joseph"> />,
document.getElementById("main")
);
------------------------------------------------------------------
State

class Counter extends Component{
constructor(props){
super(props);
this.state = {counter: 0}
this.increment = this.increment.bind(this);
}

increment(){
this.setState({counter: this.state.counter + 1})
}


render(){
return(
<button onClick={this.increment}>Like</button>
<p>{this.state.counter}</p>
)
}

 

[ENEMY]

bump

 

[MCGSLG]

Saralawa props kiyanne component ekakata eyage calling component eken labena dewal.

state kiyanne component eka sathuwa danata tiyena dewal.

apita props wenas karanna baa namuth state eke tiyena ewa wenas karanna puluwan.

Example ekak kiwwoth

Parent.js

render(){
    return (
                  <div>
                        <Child sirName="Snow" />
                  <div>
               )
}

Child.js

constructor(){
    this.state = { 
             firstName : Jon
    }

}

render(){
    return (
                  <h1>First Name : {this.state.firstName}  <br />
                          Second Name : { this.props.sirName}  <h1>
               )
}

[SIZE="5"]
First Name : Jon
Second Name :  Snow 
[/SIZE]

Uda tiyena code eke Parent component eken Child component ekata call karanawa. Ethakota Parent component eken yawanawa data widiyata sirName kiyala attribute ekak Child component ekata. Eee wage ona ekak yawanna puluwan. Function ekak unath reference ekak widiyata eelaga component ekakakta yawanna puluwan.

Dan child component eka create wenakotama eyage props hatiyata ara sirName kiyana eka eyata tiyenawa. Thawa eyage state eke data widiyata FirstName kiyana eka tiyenawa. Mewa component eka athule ona thanakadi apita this.state hari this.props hari widiyata ganna puluwan. this.setState walin apita firstName kiyana eka wenas karannath puluwan.

 

[tron213]

saralava mata therena vidiyata mehema kiynnam.

hithanna ube main screen ekak thiyenava. eke login form ekak thiyenava. e login form eke text input 2k thiyenva username and password kiyala. habai eke uba 2 tama use karanna eka thanaka hadagatta thani custom text input component (child) ekak kiyla hithanna. main screen (parent) eke e custom component eka (child) import karala thama main screen eke form eka penanne kiyala hithann.

user login veddi username ekai password ekai type karanna onene . type karaddi e velave thiyena value eka uba main screen eke thiyaganne state eka use karala. this.setState method eken.

dan e values tika main screen eke thiyagena vitharak therumak nane. eka pass karanna one ube thani custom text input field ekata. then kalin mention karapu vidiyata state eka use karala manipulate karagatta values eka main screen eken (parent eken) ube custom text input component ekata (child component ekata) pass karanna vidiyak thiyenna onene, athatama type karaddi e custom component eke eveleta type karana value eka visible venna.

e de venna ara kalin state eke finalized karagattu value eka custom text input ekata send karaganna use karanne props

mainly hithahan data change karaganna/ manipulate karaganna initially one unama state eka use karala pase chil component ekata prop ekak vidiyata final value eka pass karaganna.

react native karana anith aya uda info eke adu paadu thiyenvanam correct karanna. mage knowldge eka anuwa mama kive

breif:
props valadi apita manipulation karanna bane. eka hinda initially state ekedi manipulate karagena prop ekak through avashya thanata pass karagannava between multiple components.

 

[sliit_kolla]

props contains information set by the parent component (although defaults can be set) and should not be changed.

state contains “private” information for the component to initialise, change, and use on it’s own.

props are a way of passing data from parent to child. ... State is reserved only for interactivity, that is, data that changes over time.

Props

class Hello extends React.Component<Props, any> {
render() {
return <h1>Hello from {this.props.name}!</h1>;
}
}

// invoke the component by passing props
ReactDOM.render(
<Hello name="Joseph"> />,
document.getElementById("main")
);
------------------------------------------------------------------
State

class Counter extends Component{
constructor(props){
super(props);
this.state = {counter: 0}
this.increment = this.increment.bind(this);
}

increment(){
this.setState({counter: this.state.counter + 1})
}


render(){
return(
<button onClick={this.increment}>Like</button>
<p>{this.state.counter}</p>
)
}

godak pin macho ubata..godakma pin

 

[sliit_kolla]

Saralawa props kiyanne component ekakata eyage calling component eken labena dewal.

state kiyanne component eka sathuwa danata tiyena dewal.

apita props wenas karanna baa namuth state eke tiyena ewa wenas karanna puluwan.

Example ekak kiwwoth

Parent.js

render(){
    return (
                  <div>
                        <Child sirName="Snow" />
                  <div>
               )
}

Child.js

constructor(){
    this.state = { 
             firstName : Jon
    }

}

render(){
    return (
                  <h1>First Name : {this.state.firstName}  <br />
                          Second Name : { this.props.sirName}  <h1>
               )
}

[SIZE="5"]
First Name : Jon
Second Name :  Snow 
[/SIZE]

Uda tiyena code eke Parent component eken Child component ekata call karanawa. Ethakota Parent component eken yawanawa data widiyata sirName kiyala attribute ekak Child component ekata. Eee wage ona ekak yawanna puluwan. Function ekak unath reference ekak widiyata eelaga component ekakakta yawanna puluwan.

Dan child component eka create wenakotama eyage props hatiyata ara sirName kiyana eka eyata tiyenawa. Thawa eyage state eke data widiyata FirstName kiyana eka tiyenawa. Mewa component eka athule ona thanakadi apita this.state hari this.props hari widiyata ganna puluwan. this.setState walin apita firstName kiyana eka wenas karannath puluwan.

godak pin ban ubatath..thanx machan

 

[Slimline]

මචන්ලා, Topic එකට අදාල නැති වෙන එක ගැන සමාවෙන්න ඕන.මම මේ ත්‍රෙඩ් එකේ ඉන්න අයට PM එහෙම දාල තියෙන්නෙ.
React Native ජොබ් තියනව. Interested නම් පොඩ්ඩක් PM කරන්න. දන්න එවුන්ටත් කියන්න.

 

[Omega_Jay]

බම්පි

 

[Rahula Kasun]

bump​

 

[gihan798114]

godak pin macho ubata..godakma pin

elakiri