您可以使用内联样式或样式化组件进行react-native过渡

时间:2017-02-24 11:31:33

标签: javascript react-native styled-components

是否可以使用StyleSheet或样式组件进行本机反应转换?我正在尝试以下但没有运气。

import React from 'react'
import styled from 'styled-components/native'
import { Text, View, StyleSheet } from 'react-native'

export default class extends React.Component {
  render() {
    return (
      <Wrapper visible={visible}><Text>hello</Text>
    )
  }    
}

const Wrapper = styled.View`
  opacity: ${props => props.visible ? 1 : 0};
  transition: opacity 1s linear;
`

const styles = StyleSheet.create({
  wrapper: {
    opacity: 1,
    transition:'opacity 1s linear'
  }
});

1 个答案:

答案 0 :(得分:2)

React Native不支持以这种方式进行反应样式转换,而是尝试使用RN动画视图库,它的工作方式非常相似(并使用内联样式/组件):

https://facebook.github.io/react-native/docs/animated.html