как правильно установить setState в функции реагировать

Question

В моем случае я хочу изменить URL-адрес изображения на файл base64 с помощью библиотеки "base64-img".

Я намерен сохранить результаты преобразования файла в состояние.Я попытался сохранить его в переменной также не удалось.Я написал сценарий следующим образом:

var base64Img = require('base64-img');
base64Img.requestBase64('url_image', function(err, res, body) {
  this.setState ({ b64:body });
});

Я получаю сообщение об ошибке Uncaught TypeError: Cannot read property 'setState' of undefined

Я пытаюсь установить значение переменной, тогда console_log работает хорошо, но значение не может быть доступно изснаружи.

let b64;
base64Img.requestBase64('url_image', function(err, res, body) {
  b64 = body;
  console.log(b64);
});

Я хочу использовать значение b64 вне функции.Спасибо

Answer 1

Вы можете использовать функцию стрелки ES6 для вызова setState и для доступа к b64 вне функции или в пользовательской функции, вы можете связать функцию внутри конструктора и получить доступ с помощью этого

const base64Img = require('base64-img');
//convert image to base 64
convertImgtoBase64(imageUrl) {
    base64Img.requestBase64(imageUrl,(err, res, body) => {
       this.setState ({ b64:body });
    });
}

Как это

constructor(props){
    super(props);
    this.state = {
        b64: null
    };
    this.convertImgtoBase64 = this.convertImgtoBase64.bind(this);
    this.showBase64Value = this.showBase64Value.bind(this);
   }
   showBase64Value(){
      console.log(this.state.b64);
   }

Answer 2

Вы использовали

var base64Img = require('base64-img');
base64Img.requestBase64('url_image', function(err, res, body) {
  this.setState ({ b64:body });
});

Здесь это будет указывать экземпляр функции, так что этот экземпляр не будет содержать метод setState

Поэтому я предлагаю попробовать использовать вот так

var base64Img = require('base64-img');
let _self = this;
base64Img.requestBase64('url_image', function(err, res, body) {
  _self.setState ({ b64:body });
});