小编Mab*_*eek的帖子

我一直遇到这个问题,componentDidMount()在刷新当前页面(以及随后的组件)时,我的方法中的代码没有正确触发.但是,它通过单击链接在我的网站上导航和路由完美地工作.刷新当前页面？不是机会.

我发现问题是componentWillUnmount()当我刷新页面并触发精细点击链接并浏览我的网站/应用程序时不会触发.

触发componentWillUnmount()对我的应用程序至关重要,因为我在componentDidMount()方法中加载和处理的数据对于向用户显示信息非常重要.

我需要componentWillUnmount()在刷新页面时调用,因为在我的componentWillMount()函数中(每次刷新后需要重新渲染)我做一些简单的过滤并将该变量存储在状态值中,该状态值需要logos按顺序存在于状态变量中使组件的其余部分工作.在组件的生命周期中,这不会随时更改或接收新值.

componentWillMount(){
  if(dataReady.get(true)){
    let logos = this.props.questions[0].data.logos.length > 0 ? this.props.questions[0].data.logos.filter((item) => {
      if(item.logo === true && item.location !== ""){
        return item;
      }
    }) : [];
    this.setState({logos: logos});
  }
};

悬崖:

• 我在componentWillMount()方法中进行数据库过滤
• 刷新后需要它出现在组件中
• 但我有一个问题,componentWillUnmount()当页面刷新时不会触发
• 需要帮忙
• 请

所以我没有使用通用Accounts-ui包,正在配置密码恢复系统.到目前为止,这么好......直到下面的错误出现:

我知道这是我的smtp设置错误/sever/smtp.js,其内容如下:

Meteor.startup(function () {
  smtp = {
    username: 'myEmail%40gmail.com',
    password: 'password',
    server:   'smtp.gmail.com',
    port: 25
  }

  process.env.MAIL_URL = 'smtp://myEmail%40gmail.com:' + encodeURIComponent('password') + "@smtp.gmail.com:25";
});

我想你可以完全忽略smtp上面的对象,因为我必须手动更改process.env.MAIL_URL变量,因为我之前有另一个错误.整个过程在我的本地计算机/ localhost上设置.

在此之前我有端口465,并且在找不到用户名和密码时出错.我改为端口25,这个过程一直有效,直到我收到这个错误,说从未收到过问候语.

对此有任何帮助非常感谢.

编辑:我还想补充说,添加电子邮件包和更改端口会混淆Accounts.createUser功能,除非我从服务器上删除smtp设置,否则Meteor无法创建用户.

我正在尝试在我的网站上设置一个小的上传部分,供用户上传个人资料图片.我正在使用Slingshot和Google Cloud并从localhost进行测试,但是我收到了以下错误:

OPTIONS https://mybucket.storage.googleapis.com/ net::ERR_INSECURE_RESPONSE

我认为这个错误是因为我的CORS配置,所以我尝试了各种不同的设置,没有任何作用.

这是我最近的CORS设置:

[
    {
      "origin": ["http://localhost:3000/"],
      "responseHeader": ["Content-Type"],
      "method": ["GET", "HEAD", "DELETE"],
      "maxAgeSeconds": 3600
    }
]

我也尝试过这样:

[
    {
      "origin": ["*"],
      "responseHeader": ["*"],
      "method": ["GET", "HEAD", "DELETE"],
      "maxAgeSeconds": 3600
    }
]

依然没有.和以前一样的错误.

这是Slingshot的服务器代码:

if(Meteor.isServer){

// Initiate file upload restrictions
  Slingshot.fileRestrictions("userLogoUpload", {
  //Only images are allowed
  allowedFileTypes: ["image/png", "image/jpeg", "image/gif"],
  //Maximum file size:
  maxSize: 2 * 1024 * 1024 // 2 MB (null for unlimited)
});

  // Google Cloud Directives
  Slingshot.createDirective("userLogoUpload", Slingshot.GoogleCloud, {
    bucket: Meteor.settings.public.GoogleCloudBucket,
    GoogleAccessId: …

我已经多次阅读文档，但仍然不完全理解如何通过内联 CSS 设计 React 滑块的样式（https://github.com/react-component/slider）。

我发现您需要handle使用 css 和某种带有偏移和值属性的组件将属性传递给滑块。当我尝试这样做时，我的 CSS 变得很糟糕，旋钮不动，滑块到处都是。常规样式在滑块上不起作用。

这就是我传递给滑块组件的组件的样子：

从“反应”导入反应；

export default class SliderStyle extends React.Component {
  render(){
    let style = {
      position: "absolute",
      left: "0",
      height: "15px",
      borderRadius: "8px",
      backgroundColor: "#000"
    };

    let tracker = {
      position: "absolute",
      marginLeft: "-7px",
      marginTop: "-5px",
      width: "14px",
      height: "14px",
      cursor: "pointer",
      borderRadius: "50%",
      border: "solid 2px #000",
      backgroundColor: "#fff"
    }


    return(
      <div style={style}><div style={tracker}></div></div>
    )
  }
}

然后在主要组件中：

<Slider range allowCross={false} handle={<SliderStyle/>} value={this.state.range} onChange={this.onSliderChange.bind(this)}/>

我假设从传递到 Slider …

因此，我为作为图表库一部分的工具提示创建了简单的边缘检测。我无法使用已经实现边缘检测的工具提示（如 MUI 工具提示），因为图表软件只允许 HTML 工具提示，所以我只能创建一个仅对屏幕右侧进行边缘检测的 React 组件。由于工具提示始终向右侧打开，因此我只需处理右侧即可。

因此，当悬停靠近边缘时，工具提示会检查它与边缘的距离，然后我使用 CSS 偏移将工具提示放置在远离屏幕右侧的点。

该组件如下所示：

export const MyTooltip = ({ children }) => {

  useEffect(() => {
    const container =
      document.getElementById('tooltip');

    if (container) {
      const x = container.getBoundingClientRect().x;

      if (x > window.outerWidth - 200) {
    container.style.left = 'auto';
        container.style.right = '0';
        container.style.transform = `translateX(${
          window.outerWidth - x - 40
        }px)`;
      }
    }
  }, []);

  return (
    <TooltipStyle>
      <div id="tooltip" className="custom-tooltip">
        {children}
      </div>
    </TooltipStyle>
  );
};

TooltipStyle 是一个样式化组件，具有用于背景、填充等的 .custom-tooltip 类的 CSS。200px 是所有实例中工具提示的宽度，40px 是填充。

问题：有时，当工具提示在 …

当使用Axios/http请求设置标头时,我在向服务器发出请求时遇到问题.我添加的任何标头(content-type标头除外)都会导致相同的错误:"预检的响应具有无效的HTTP状态代码405".这在Chrome,Firefox,Edge等中都是如此.

具体来说,我需要为我需要连接的服务添加Authorization标头以进行帐户验证.

使用API​​ URI在Postman上运行GET请求工作正常,我得到了所需的响应.在浏览器中的React应用程序中运行它会给出HTTP 405错误.我在本地节点服务器上运行此Allow-Control-Origin功能,并安装了Google的扩展程序并启用了http://localhost:3000.

当我运行没有任何标头参数的请求时:

axios.get("https://myrequest.com/req/reqservice.svc/Login",).then(data => console.log(data)).catch(err => console.log(err))

请求工作正常.当我用标题(任何标题,但在我的情况下,授权标题)运行它时,我得到错误:

axios.get("https://myrequest.com/req/reqservice.svc/Login", { headers: { "Authorization": "randomExample" } }).then(data => console.log(data)).catch(err => console.log(err))

那么,可能导致这个问题的原因是什么？如果是CORS或连接问题,我一般不会在提出请求时遇到问题吗？我一直在仔细阅读Stack Overflow,没有回答给我解决方案.我完全迷失了该做什么,而且我已经在没有一个解决方案的情况下工作了好几天.任何输入都将非常感激.

例如，如果我有这行代码：

const subject = collection.city?.person;

if(subject.name === "Jimmy") {
// do something
}

例如，静态分析工具会对这行代码大喊大叫，因为它们认为它“错误地使用了类似 null 的值”。因为如果主题为空，则subject.name无法定义。然而，ESLint 让它作为有效代码通过。

有没有办法配置 ESLint 以在构建时到达静态分析工具之前捕获这些类型的错误？

这是代码:

var InvertedPeninsula = function() {
  this.inhabitants = [
    {
      name: 'Sir Charles',
      race: 'Human'
    },
    {
      name: 'Ealei',
      race: 'Elf'
    }
  ];
  // Adds an extra humans method property to the inhabitants array to return all Humans
  this.inhabitants.humans = function() { /* returns all Human inhabitants */ };
};

// Create a new invertedPeninsula
var invertedPeninsula = new InvertedPeninsula();

// Log the name of each invertedPeninsula inhabitant
for (var i in invertedPeninsula.inhabitants) {
  console.log(invertedPeninsula.inhabitants[i].name);
}

对我来说,它看起来像是2x.3x来自哪里？阵列中只有2个单元格.

因此问题如下：

给定一个数组a，其中只包含从1到a.length范围内的数字，请找到第一个重复的数字，其第二次出现的索引最小。换句话说，如果重复的数字多于1个，则返回其第二次出现的索引小于另一个数字的第二次出现的索引的数字。如果没有这样的元素，则返回-1。编写一个具有O（n）时间复杂度和O（1）额外空间复杂度的解决方案。

我有一个解决方案，但是显然它的速度不够快，并且当阵列中有超过一千个项目时会停顿。

这就是我所拥有的：

function firstDuplicate(arr) {
  let dictionary = {};

  for(let i = 0, ii = arr.length; i < ii; i++) {
    for(let z = i+1, zz = arr.length; z < zz; z++) {
      if(arr[i] === arr[z]) {
        if(dictionary.hasOwnProperty(arr[i])) {
          if(dictionary[arr[i]] !== 0 && dictionary[arr[i]] > z) {
            dictionary[i] = z;
          }
        } else {
          dictionary[arr[i]] = z;
        }
      }
    }
  }

  let answer = [];

  for(key in dictionary) {
    // [array number, position];
    answer.push([key, dictionary[key]]);
  };

if(answer.length > …

假设我有这个字符串（它是由 html 标签组成的字符串）：

const str = "<li class='test'>
    <div class='myDiv' >
    <span class='myClass'>Person is a: </span>
    <a class='myLink' tabindex='0'> Great citizen. Really nice guy</a>
    </div>
    </li>"

我如何删除<span>标签以及它们之间的所有内容，因此输出如下：

const str = "<li class='test'>
    <div class='myDiv' >
    <a class='myLink' tabindex='0'> Great citizen. Really nice guy</a>
    </div>
    </li>"

感谢您的帮助！

所以我的数组看起来像这样:

var data = ["5/10/2014", 2, "5/10/2014", 5, "5/11/2014", 6....];

该阵列有超过数千个细胞,这无关紧要,但无论如何我都会提到它.

我想将该数组转换为如下所示的对象数组:

var iWantToBelieve = [{Date:"5/10/2014", Score: 2}, {Date: 5/10/2014, Score:5}.....];

我觉得我已接近解决问题,但我的代码给了我最终的结果:

 var iWantToBelieve = [{Date:"5/10/2014", Score: "5/10/2014"}, {Date: 5/10/2014, Score: "5/10/2014"}.....]

我的代码看起来像这样:

 var data = ["5/10/2014", 2, "5/10/2014", 5, "5/11/2014", 6....];
 var init = [];
 var tempObject;

 for(var z = 0; z < data.length; z++){

     var tempArray = ["Date", "Score"];
     tempObject = {};

     for(var y = 0; y < tempArray.length; y++){
         tempObject[tempArray[y]] = data[z];
     }

     init.push(tempObject);
 }

我知道第二个for循环在第一个循环开始另一次迭代之前完成了2次迭代,因此Date和Score键都被日期字符串占用.

任何帮助表示赞赏.