Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Failed prop type: Invalid prop shadowOffset.width #55

Open
user471 opened this issue Feb 12, 2017 · 0 comments
Open

Failed prop type: Invalid prop shadowOffset.width #55

user471 opened this issue Feb 12, 2017 · 0 comments

Comments

@user471
Copy link

user471 commented Feb 12, 2017

It's react-native-web, but this could be a animated bug.

This code works for opacity animation

import {
	AppRegistry,
	Text,
	View,
	Animated
} from 'react-native';
import React from 'react'

class SampleApp extends React.Component {
	constructor(props) {
		super(props);

		this.state = {
			fadeAnim: new Animated.Value(1), 
		};
	}

	componentDidMount() {
		Animated.timing(       
				this.state.fadeAnim,  {
					toValue: 0,       
					duration: 2000    
				}
				).start();             


	}

	render() {
		return (
				<Animated.View style={{width : 300, opacity:this.state.fadeAnim, shadowColor: "black"}}>
					<Text>React Native Web</Text>
				</Animated.View>
				);
	}
}

const rootTag = document.getElementById('react-root');
AppRegistry.registerComponent('SampleApp', () => SampleApp);
AppRegistry.runApplication('SampleApp', { rootTag });

but if I try to use it with shadowOffset

import {
	AppRegistry,
	Text,
	View,
	Animated
} from 'react-native';
import React from 'react'

class SampleApp extends React.Component {
	constructor(props) {
		super(props);

		this.state = {
			fadeAnim: new Animated.Value(1), 
		};
	}

	componentDidMount() {
		Animated.timing(       
				this.state.fadeAnim,  {
					toValue: 0,       
					duration: 2000    
				}
				).start();             


	}

	render() {
		return (
				<Animated.View style={{width : 300, shadowColor: "black", shadowOffset: {width: this.state.fadeAnim , height: this.state.fadeAnim }}}>
					<Text>React Native Web</Text>
				</Animated.View>
				);
	}
}

const rootTag = document.getElementById('react-root');
AppRegistry.registerComponent('SampleApp', () => SampleApp);
AppRegistry.runApplication('SampleApp', { rootTag });

It doesn't work

Warning: Failed prop type: Invalid prop `shadowOffset.width` supplied to `View`.
Bad object: {
  "width": 300,
  "shadowColor": "black",
  "shadowOffset": {
    "width": {
      "_children": [],
      "_value": 1,
      "_offset": 0,
      "_animation": null,
      "_listeners": {}
    }
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant