我创建了一个新的 SharePoint Web 部件（版本 1.7.1）。我正在使用反应模板。 Web 部件非常基础，但不能在 IE 11 上运行。
返回的错误是 对象不支持属性或方法'find'
我没有在我的任何 .ts 文件中使用 find，所以我发现 .find 方法正在被从我的 .ts 文件转译的 .js 文件调用。
有人可以确认这是 SPFX v1.7.1 中的错误吗？ 如果有，有没有解决办法。
我知道这可以通过引入垫片来解决，但我不知道如何为 SPFX 配置它，也找不到任何说明如何执行此操作的文档。
欢迎任何帮助。
【问题讨论】：
如果我没记错的话，这是因为 IE 11 不支持 React 引擎使用的Element.closest。
我个人使用element-closest 来填充它，尽管我确信还有其他选择。
// beginning of WebPart code file
import 'element-closest/browser';
import * as React from 'react';
import * as ReactDom from 'react-dom';
// rest of the code, etc.
【讨论】：
Element.closest 问题可能不相关，尽管我之前肯定不得不为我的 SPFx 解决方案填充它。回答你的后续问题：是的，那是因为没有随这个包安装 TypeScript 类型 - 它仍然会正确填充，你可以忽略 TSLint 投诉。
参考this article，可以看到Array.prototype.find()方法不支持IE浏览器。但是，此方法已添加到 ECMAScript 2015 规范中，可能尚未在所有 JavaScript 实现中可用。但是，您可以使用以下 sn-p 填充 Array.prototype.find：
// https://tc39.github.io/ecma262/#sec-array.prototype.find
if (!Array.prototype.find) {
Object.defineProperty(Array.prototype, 'find', {
value: function(predicate) {
// 1. Let O be ? ToObject(this value).
if (this == null) {
throw new TypeError('"this" is null or not defined');
}
var o = Object(this);
// 2. Let len be ? ToLength(? Get(O, "length")).
var len = o.length >>> 0;
// 3. If IsCallable(predicate) is false, throw a TypeError exception.
if (typeof predicate !== 'function') {
throw new TypeError('predicate must be a function');
}
// 4. If thisArg was supplied, let T be thisArg; else let T be undefined.
var thisArg = arguments[1];
// 5. Let k be 0.
var k = 0;
// 6. Repeat, while k < len
while (k < len) {
// a. Let Pk be ! ToString(k).
// b. Let kValue be ? Get(O, Pk).
// c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)).
// d. If testResult is true, return kValue.
var kValue = o[k];
if (predicate.call(thisArg, kValue, k, o)) {
return kValue;
}
// e. Increase k by 1.
k++;
}
// 7. Return undefined.
return undefined;
},
configurable: true,
writable: true
});
}
另外，据我所知，当我们使用React时，默认生成的react项目支持所有现代浏览器。对 Internet Explorer 9、10 和 11 的支持需要 polyfills。你可以检查它并导入相关的包。
【讨论】：
WebPart.ts 文件的开头。每当 Web 部件中的其他代码调用它时，它将实现 Array.find() 方法，包括通过依赖于使用 Array.find 的任何导入。
您可以调整您的 tsconfig.json 文件：在“compilerOptions”下将“target”设置为“es5”。 Typescript 将为您创建 polyfill。
【讨论】：
我有同样的问题。在您的 webpart.ts 文件中使用此导入。
import 'core-js/modules/es6.array.find';
【讨论】：