简体   繁体   中英

React Native View style props as inline props

This is not bug. Is just to be sure on the View styles props object is supporting as inline props also?

Example (Classic way, also written in React Native Doc)

function App() {
  return (
    <View style={styles.box}></View>
  )
}

const styles = Stylesheet.create({
  box: {
    height: 200,
    width: 200,
    backgroundColor: 'tomato',
  },
})

Nothing wrong on the example above, working expected. However, I was try to build style box component which inspired by React Material UI 's Box component and I found out there is another simple way to do which is you can write the style property in View as props. following example I tried on React Native 0.62.

function App() {
  return (
    <View
      height={200}
      width={200}
      backgroundColor="tomato"
    ></View>
  )
}

This is not written in the React Native Docs, just want to be sure is it safe to use?

here is example

function App() {
  return (
    <View
style={{
      height:200,
      width:200,
      backgroundColor:"tomato"}}
    >
//here your code
</View>
  )
}

here an other example style class with inline style

function App() {
  return (
    <View
style={[style.classNameHere,{
      height:200,
      width:200,
      backgroundColor:"tomato"}]}
    >
//here your code
</View>
  )
}

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM