React Parallax прокрутка видео фон - PullRequest
Новая
       6

React Parallax прокрутка видео фон

0 голосов
/ 30 января 2019

Я пытаюсь использовать модуль react-native-parallax-scroll-view для содержания прокрутки параллакса с видео фоном.В React я свежий.

Я использую этот модуль: https://github.com/i6mi6/react-native-parallax-scroll-view

Мой код: 

import React from 'react';
import ReactDOM from 'react-dom';
import ParallaxScrollView from 'react-native-parallax-scroll-view';

class ParallaxComponent extends React.Component {
  render() {
    return (
     <div fluid style={{ marginTop: '61px', overflow: 'hidden', boxSizing: 'context-box' }}>
          <ParallaxImage />
    </div>
    )
  }
}

class ParallaxImage extends React.Component {
    render() {
      return (
        <ParallaxScrollView
          backgroundColor="blue"
          contentBackgroundColor="pink"
          parallaxHeaderHeight={300}
          renderForeground={() => (
            <video autoPlay loop id="video-background" muted plays-inline style={{width:"100%",height:"100%"}}>
              <source src="./backgroung_massage.mp4" type="video/mp4" />
            </video>
          )}>
          <View style={{ height: 500 }}>
            <Text>Scroll me</Text>
          </View>
        </ParallaxScrollView>
      );
    }
}

ReactDOM.render(
    <div>
        <ParallaxComponent/>
    </div>,
  document.getElementById('app')
);

И ошибка: 

 ERROR in ./node_modules/react-native-parallax-scroll-view/src/index.js 14:26
 Module parse failed: Unexpected token (14:26)
 You may need an appropriate loader to handle this file type.
 | const pivotPoint = (a, b) => a - b
 |
 > const renderEmpty = () => <View />
 |
 | const noRender = () => <View style={{ display: 'none' }} />
  @ ./src/index.js 21:0-67 67:33-51
  @ multi (webpack)-dev-server/client?http://0.0.0.0:3000 (webpack)/hot/dev-serve
 r.js ./src/index.js

Где ошибка?У меня нет идей.В интернете не могу найти ни одного решения.

...