Пытаясь отредактировать изображение в реагирующем родном фоторедакторе, но получая ошибку, не могу найти переменную RNFS - PullRequest
0 голосов
/ 09 октября 2019
import * as ImagePicker from 'expo-image-picker';
import * as Permissions from 'expo-permissions';

// Импортирование фоторедактора rn для редактирования изображений

import { RNPhotoEditor } from 'react-native-photo-editor'

// варианты выбора изображений

const options = {
  mediaTypes: ImagePicker.MediaTypeOptions.All,
      allowsEditing: true,
      aspect: [4, 3],
}

// использование эффекта для получения разрешения

 useEffect(() => {
    this.getPermissionAsync()

  }, [this.getPermissionAsync])

// Сохранение изображения в состоянии

  const [ image, setImage ] = useState(null);

// Получение разрешения

getPermissionAsync = async () => {
      const { status } = await Permissions.askAsync(Permissions.CAMERA_ROLL);
      if (status !== 'granted') {
        alert('Sorry, we need camera roll permissions to make this work!');
      }
  }

// методы выбора и редактирования изображения

 const pickImage = async () => {
        let result = await ImagePicker.launchImageLibraryAsync(options)
      console.log(result);
      if(result) {
        setImage(result.uri);
      }
      }

  const editImage = async() => {
    console.log(image.replace('file://', ''))
    RNPhotoEditor.Edit({
      path:RNFS.DocumentDirectoryPath + image,
      hiddenControls: ["save"],
      onDone: (res) => {
          console.log('on done');
          self.setState({isRefresh: !this.state.isRefresh, imageHash: Date.now(), state: self.state});
      },
      onCancel: (res) => {
          console.log('on cancel');
          Alert.alert('', 'Edit Cancelled !')
      }
  });
  }

// Реагируем на родной вид, выбирая и редактируя изображение отсюда

<TouchableOpacity>
      <Text style={{marginVertical: 20}} onPress={() => pickImage()}>Gallery</Text>
      <Text style={{marginVertical: 20}}>Camera</Text>
      <Text style={{marginVertical: 25}} onPress={() => editImage()}>Edit Image</Text>
    </TouchableOpacity>

1 Ответ

0 голосов
/ 09 октября 2019

Ваш код:

путь: RNFS.DocumentDirectoryPath + image,

Вы должны импортировать его. если вы используете expo, ваш код должен выглядеть следующим образом:

import {FileSystem} from 'expo'

для получения более подробной информации, пожалуйста, обратитесь к документу expo, если вы не используете expo, ваш код должен быть:

var RNFS = require('react-native-fs');

, но вы должнысначала установите его и следуйте инструкциям для конфигурации

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