• Jobs
  • About Us
  • professionals
    • Home
    • Jobs
    • Courses and challenges
  • business
    • Home
    • Post vacancy
    • Our process
    • Pricing
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Salary Calculator

0

118
Views
Using onChangeText and onFocus to alter style of a text block

Refering to the code below, how can I write it so that when onFocus and onChangeText is called, the value of marginTop changes from 3 to 5?

       <Block>
          <Text marginTop={3}>TEXT</Text>
          <Block>
            <Input
              keyboardType="phone-pad"
              placeholder="Phone number"
              defaultValue={details?.phone}
              onChangeText={(value) => onChange({ phone: value })}
              onFocus?
            />
          </Block>
        </Block>

Any hint would be greatly appreciated. Thanks in advance.

about 3 years ago · Santiago Trujillo
2 answers
Answer question

0

margin changes when either onChangeText or onFocus is called

 const [changeMargin, setChangeMargin] = useState(false)  ;
    <Block>
                  <Text marginTop={changeMargin ? 5: 3}>TEXT</Text>
                  <Block>
                    <Input
                      keyboardType="phone-pad"
                      placeholder="Phone number"
                      defaultValue={details?.phone}
                      onChangeText={(value) => { if(value !=null && value.length >0){setChangeMargin(true) ;}else{setChangeMargin(false) ;};
 onChange({ phone: value })}}
                      onFocus={()=>{setChangeMargin(true)}}
                    />
                  </Block>
                </Block>
about 3 years ago · Santiago Trujillo Report

0

const [move, setMove] = useState(false)
<Block>
  <Text marginTop={3}>TEXT</Text>
  <Block>
    <Input
      keyboardType="phone-pad"
      placeholder="Phone number"
      defaultValue={details?.phone}
      onChangeText={(value) => setMove(true)
      style={move && /* do something*/}
      onFocus?
    />
  </Block>
</Block>
about 3 years ago · Santiago Trujillo Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Our process Sales
Legal
Terms and conditions Privacy policy
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recommend me some offers
I have an error