스타일을 React Native의 숫자에 매핑하는 방법은 무엇입니까?

Question

나는 React Native를 사용하여 모바일 응용 프로그램을 작성하고있었습니다.

ReactNative.StyleSheet을 사용하여 작은 세트의 스타일을 만들고이를 내 구성 요소에 사용했습니다.

나는 여기에서 뭔가 특별한 것을 목격했다. 내 스타일이 어떤 숫자로 매핑된다는 것을 알았습니다. 이상적으로 나는 스타일을 인쇄 할 때 존재할 객체를 기대하고있었습니다. 다음

내 CSS입니다 : -

const styles = StyleSheet.create({ 
    container: { 
    flex:1, 
    alignItems:'center', 
    width: null, 
    }, 
    logo: { 
    width:110, 
    marginTop:84, 
    resizeMode:'contain' 
    }, 
    mascot:{ 
    width:145, 
    height:150, 
    marginTop:73, 
    resizeMode:'contain' 
    }, 
    button:{ 
    backgroundColor:'#4A90E2', 
    width:300, 
    alignSelf:'center', 
    }, 
    buttonContainer:{ 
    marginTop:70 
    } 
}) 

및 console.log(style) 날 다음 보여줍니다. 나는이 숫자들이 무엇인지 이해하려고 노력하고 있는가?

는

Answer 1

StyleSheet.create의 아이디어는 스타일 시트 객체가 하나 생성 횟수를 줄이는 것입니다. 객체는 항상 동일한 값을 가지므로 그렇게하는 것이 합리적이며 일부 처리 시간을 절약하는 매우 간단한 방법입니다. 숫자는 생성 된 StyleSheet 객체에 대한 참조 일뿐입니다.

정적 이미지에서도 비슷한 현상이 발생합니다. 값이 require('./myImage.png') 인 경우 숫자도 표시됩니다. 다시 말하지만, 동일한 최적화 이유 때문입니다.