React-native-видео не меняет видео при смене источника - PullRequest
Новая
       32

React-native-видео не меняет видео при смене источника

1 голос
/ 03 марта 2020

Я использую реагирующее видео для рендеринга видеоплеера для моего приложения.

Я пытаюсь изменить источник видео. Это мой код хорошо работает. 

<Video source={{uri: _getVideo().video_url}}
       style={Styles.backgroundVideo}
       autoplay={true}
       controls={false}
       disableFocus={true}
       resizeMode="cover"/>;

Но я меняю 'controls = {true}'. Это не рендеринг нового видео, просто рендеринг аудио. И до сих пор показывают старое видео. 

_getVideo().video_url

Эта функция просто возвращает исходное видео. Я уверен, что элемент также изменяет источник, но не перерисовывает новое видео.

Есть ли какое-нибудь решение для его разрешения? Спасибо!

1 Ответ

0 голосов
/ 03 марта 2020

Вы делаете это неправильно, хотя это работает.

Но позвольте мне рассказать вам, что здесь происходит, 

source={{uri: _getVideo().video_url}}

эта строка выполняется каждый раз, когда выполняется метод render, и render метод вызывается после setState, изменения реквизита и другие события.

Таким образом, ваш метод _getVideo() будет вызываться много раз, хотя это и не требуется.

Поэтому я предлагаю вам инициализировать один из них. переменная состояния для URL. вызовите _getVideo () где хотите. может быть на componentDidMount для первого запуска и последующего нажатия кнопки или чего-либо еще, но вы можете установить этот URL в это состояние с помощью setState в методе _getVideo.

, поэтому желаемая вещь будет выглядеть так: 

<Video key={this.state.videoComponentKey}
       source={{uri: this.state.video_url}}
       style={Styles.backgroundVideo}
       autoplay={true}
       controls={false}
       disableFocus={true}
       resizeMode="cover"/>;

Теперь, если вы заметили, что я добавил еще одну опору key, это решит вашу старую проблему с видео. всякий раз, когда URL-адрес изменяется, что-то изменить в ключе. так что я взял одно государство и передал его этой опоре. теперь вы можете инициализировать его с 0 и в следующий раз просто увеличить его с помощью setState.

...