小编Nul*_*rue的帖子

我知道在这里广泛回答了找到JS对象的长度

建议的解决方案之一是 Object.keys(myObj).length

但是,我很难找到如何找到对象数组中包含的所有属性的长度.

即:

const users = [
  {
    firstName: "Bruce",
    lastName: "Wayne",
    id: "1",
  },

  {
    firstName: "Peter",
    lastName: "Parker",
    id: "2"
  },

  {
    firstName: "Tony",
    lastName: "Stark",
    id: "3"
  }
];

Object.keys(users).length //3

鉴于上面的示例,如何输出9检索对象数组上所有属性的长度？

这可以用reduce方法完成吗？提前致谢.

在给定的数组上:

const arr = [
  { fn: "Steve", ln: "Jobs" },
  { fn: "Dennis", ln: "Rodman" },
  { fn: "Karl", ln: "Malone" },
  { fn: "Vince", ln: "Carter" },
  { fn: "Steve", ln: "King" }
];

如果我想返回一个新的数组,不包括任何名为史蒂夫的人,我可以运行:

const filteredArr = arr.filter(obj => obj.fn != "Steve");

在没有使用toLowerCase()的情况下,如果史蒂夫名字可能是低级或大写,我怎么能写一个正则表达式来实现相同的结果呢？

  { fn: "Steve", ln: "Jobs" },
  { fn: "Dennis", ln: "Rodman" },
  { fn: "Karl", ln: "Malone" },
  { fn: "Vince", ln: "Carter" },
  { fn: "steVe", ln: "King" },
  { fn: …

我怎么能让每个<li />接收onClick事件的人一次只能一个人开火？

我的目的是根据点击事件更改颜色并显示/隐藏内容.它可以工作,但是当点击给定的<li/> 所有兄弟姐妹时,同时也会被解雇.

我怎么能阻止这个？

这是沙箱代码

function App() {
  return (
    <div className="App">
      <Market />
    </div>
  );
}

class Market extends Component {
  constructor() {
    super();
    this.state = {
      isColor: false,
      isShow: false,
      fruits: ["Apple", "Banana", "Peach"]
    };
  }

  handleToggle = () => {
    this.setState(currentState => ({
      isColor: !currentState.isColor,
      isShow: !currentState.isShow
    }));
  };

  render() {
    const fruits = this.state.fruits.map((item, i) => (
      <li
        key={i}
        className={this.state.isColor ? "blue" : "red"}
        onClick={this.handleToggle} …

我需要编写一个帮助程序函数，该函数遍历对象数组并过滤所有符合既定条件的名称。就我而言，所有以Zach

数组示例：

const users = [
  {
    firstName: "Zach",
    id: 1,
    lastName: "Volsk"
  },
  {
    firstName: "Surly",
    id: 2,
    lastName: "Furious"
  },

  {
    firstName: "Zach",
    id: 3,
    lastName: "Tee"
  },
  {
    firstName: "Eve",
    id: 4,
    lastName: "Zelda"
  },

  {
    firstName: "Zachary",
    id: 5,
    lastName: "Toys"
  }
];

我能够使用过滤器直接检索所需的结果并映射，即：

const filterZach = users
  .filter(user => user.firstName.startsWith("Zach"))
  .map(user => {
    return `<p>${user.firstName} ${user.lastName}</p>`;
  }).join(""); // get rid of comas

所需结果： Zach Volsk, Zach Tee, Zachary Toys

但是， …

我想了解如何打印在 React 组件内渲染的 PDF 文档。目前，我的事件处理程序没有相应地触发以启用打印。

import React, { Component } from "react";

const pdfFile =
  "https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf";

export default class PDFViewer extends Component {
  handlePrint = () => {
    // is getElementById an anti pattern even if I'm not modyfying the DOM?
    const node = document.getElementById("print-file");
    node.contentWindow.focus();
    node.contentWindow.print();
  };

  render() {
    return (
      <>
        <h2>PDF Viewer Component</h2>
        <object data={pdfFile} type="application/pdf">
          <iframe
            title="pdf document"
            id="print-file"
            src={`https://docs.google.com/viewer?url=${pdfFile}&embedded=true`}
          />
        </object>
        <button onClick={this.handlePrint}>Print</button>
      </>
    );
  }
}

我内心做错了什么吗handlePrint()？

我有一个代码沙箱，您可以在触发时看到错误的详细信息handlePrint()