Можно ли использовать тег <div>в теге React Native? - PullRequest
Новая
       1

Можно ли использовать тег <div>в теге React Native?

0 голосов
/ 11 июля 2020

Теперь я использую firebase JS SDK для аутентификации по телефону. И я последовал методу (веб-метод), это мой код. 

  handleClick = () => {
    this.state.verify_otp = "flex";
    this.state.register = "none";
    this.recaptcha = new firebase.auth.RecaptchaVerifier("recaptcha1");
    this.number = this.state.phone;
  };

. 

<View
      style={{
        alignItems: "center",
        justifyContent: "center",
        flex: 1,
        display: this.state.captcha,
      }}
    >
      <div>
        <div id="recaptcha1"></div>
      </div>
    </View>

Можно ли использовать тег в собственном коде реакции? E

Ответы [ 5 ]

1 голос
/ 13 июля 2020

Вы можете использовать react-native-render- html для достижения следующего. (если не получилось, необходимо установить response-native-webview) 

import * as React from 'react';
import { Text, View, StyleSheet,ScrollView, Dimensions } from 'react-native';
import Constants from 'expo-constants';
import HTML from 'react-native-render-html';


const htmlContent = `
    <h1>This HTML snippet is Using react-native-render-html !</h1>
    <h2>Trying many tag to render html</h2>
    <img src="https://i.imgur.com/fJ71V9b.jpg" />
    <div>Here is what you want to add!!!!!<div>`
    ;
export default function App() {
  return (
    <View style={styles.container}>
     <ScrollView style={{ flex: 1 }}>
            <HTML html={htmlContent} imagesMaxWidth={Dimensions.get('window').width} />
      </ScrollView>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    paddingTop: Constants.statusBarHeight,
    backgroundColor: '#ecf0f1',
    padding: 8,
  } 
});

Пример кода для снэка

0 голосов
/ 11 июля 2020

К сожалению, это невозможно. Div - это элемент HTML, который может быть прочитан браузером. Для мобильного приложения это View

Однако вы можете создать свой собственный div

class Div extends Component {  //or Class Span extends Component

  static propTypes = {
      style : PropTypes.obj
      onClick : PropTypes.func   // ...
  }

  render (){
        return (
        <View>
        
    /* whatever is needed to pass everything through  ... */
  
       </View>
 )    }

}

0 голосов
/ 11 июля 2020

Нет, не изначально. React Native не поддерживает прямой HTML, так как это не веб-фреймворк.

Для рендеринга HTML в React Native см. Render HTML в React Native

0 голосов
/ 11 июля 2020

Нет, вы не можете использовать элемент <div> внутри собственного компонента React, потому что React Native не имеет DOM.

0 голосов
/ 11 июля 2020

Нет, невозможно использовать теги html в react-native

edit: list of basi c RN components https://reactnative.dev/docs/components-and-apis#basic -components

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...