使用 CryptoJS 的 VueJS 哈希文件

Question

我正在与您联系，因为我非常坚持 Vue 项目...

我在尝试将 jQuery 项目移至 Vue 时遇到了一个小问题。 CryptoJS 很有用，我可以从字符串创建哈希值。

但是，我仍在努力阅读实际文件，因为嵌套函数会引发错误。特别是在 callbackRead 函数上出现错误。

App.vue?234e:280 Uncaught TypeError: this.callbackRead is not a function
at FileReader.reader.onload (App.vue?234e:280)

提前致谢！！！

此致， Mac

Answer 1

错误来自此部分：

reader.onload = function(evt) {
    this.callbackRead(this, file, evt, callbackProgress, callbackFinal);
};

问题是 this 引用了错误的对象。您的 onload 处理程序是与周围代码不同的函数，每当您输入新函数时，this 的值都会发生变化。

有几种可能的解决方案。

别名 this:

const that = this;

reader.onload = function(evt) {
    that.callbackRead(that, file, evt, callbackProgress, callbackFinal);
};

绑定this:

reader.onload = function(evt) {
    this.callbackRead(this, file, evt, callbackProgress, callbackFinal);
}.bind(this);

使用箭头函数，不会改变 this 的值：

reader.onload = evt => {
    this.callbackRead(this, file, evt, callbackProgress, callbackFinal);
};

VueJS hash files with CryptoJS