每次刷新页面时,Javascript Onclick = window.open()函数都会打开一个新页面吗?

时间:2019-03-15 18:11:47

标签: javascript reactjs onclick refresh window.open

所以我有一个DIV元素,当按下该元素时,我想在其他窗口中打开一个新选项卡。唯一的问题是,每当刷新页面或按下任何其他div元素时,该函数也会同时启动并在另一个窗口中打开页面。我将在下面包含我的代码,但是我不确定为什么如此使用onClick={window.open("https://www.thechinesewriter.com"),就像我说的那样,我只希望在按下div时打开一个新标签页,而不是在单击页面上的任何其他项目,甚至刷新页面本身也是如此。

import React from "react";
import "./Column1.css";

class Column1 extends React.Component {

    render() {
        return(
            <React.Fragment>
                 <div className="rectImage">
                     <img className="imagePost" src={this.props.image} />   
                 </div>
                 <div onClick={window.open("https://www.thechinesewriter.com")} className="downloadBut1">
                     <h2>
                         Source
                     </h2>
                 </div>
                 <div className="downloadBut2">
                     <h2>
                         Repository
                     </h2>
                 </div>
             </React.Fragment> 
         )
     }     
}

export default Column1;

2 个答案:

答案 0 :(得分:5)

您需要像这样将其作为回调调用。

# Built only once at global scope
_selector_lookup_table = {
    'str_en': string_encoder, 
    'nr_add': int_adder,
    'foo': some_other_func,
    ...
    'baz': yet_another_func,
    }

def selector(fun, val):
    # Reused in function for each call
    return _selector_lookup_table.get(fun, default_func)(val)

否则,每次渲染组件时都会调用此方法。

答案 1 :(得分:2)

您使用一个表达式,该表达式将在每次渲染组件时执行。

function formatThenMove() {
  var ss=SpreadsheetApp.getActive();
  var sh=ss.getActiveSheet();
  var rg=sh.getRange(1,1,20,1);//A1:A20
  var vA=rg.getValues();
  var fA=rg.getNumberFormats();
  for(var i=0;i<vA.length;i++) {
    vA[i][0]=generateString();//setup for 16 digits
    fA[i][0]="@";//here's the format for raw text
  }
  rg.setValues(vA);//set values
  rg.setNumberFormats(fA);//set formats
  sh.moveColumns(rg, 6);//move to column F
}

function generateString(sObj){
  var sObj=sObj || {uppercase:false,lowercase:false,numbers:true,allothers:false,custom:false,custxt:'',slctlen:16};//defaults to 16 digit number
  var upperCase='ABCDEFGHIJKLMNOPQRSTUVWXYZ';//26
  var lowerCase='abcdefghijklmnopqrstuvwxyz';//26
  var numBers='0123456789';//10
  var allOthers='~@#$%^&*()_-+={[}]|\:;"<,>.?/';//29
  var s='';
  var o='';
  s+=(sObj.uppercase)?upperCase:'';
  s+=(sObj.lowercase)?lowerCase:'';
  s+=(sObj.numbers)?numBers:'';
  s+=(sObj.allothers)?allOthers:'';
  s+=(sObj.custom)?sObj.custxt:'';
  for(var i=0;i<sObj.slctlen;i++){
    o+=s.charAt(Math.floor(Math.random()*s.length));
  }
  Logger.log(o);
  return o;
}

您可能打算使用函数

<div onClick={window.open("https://www.thechinesewriter.com")} className="downloadBut1">