JS表达式不能作为ReactJS中字符串的一部分工作？

Question

你能帮忙吗？

我正在尝试做以下事情......

import {chosenIpAddress} from './socketEvents.js';

const socket = socketClient(`http:// ${chosenIpAddress} :8081`);

...但无论我尝试什么,它都会忽略我的表达并将其视为http://:8081.我试过加号,逗号,反引号,引号,喊叫,并威胁它,但无济于事.

我可以注销IP地址,所以我知道它已填充,但作为字符串的一部分,它会被忽略,这让我发疯!

在此先感谢xxx

PS ..我已经看到了一些类似的问题,但这些对我的没有帮助,因此是新的问题.

更新:根据要求,这是我的出口...

let chosenIpAddress = "";

function  chosenTank(tank) {
    socket.emit('chosen tank', tank);
    console.log('Tank', tank);
    chosenIpAddress = tank.IpAddress;
}

export {
    chosenIpAddress,
};

Answer 1

您需要导出一个在调用时返回IP地址的函数.

导入的文件chosenIpAddress具有原始值(空字符串),但即使chosenTake调用它也永远不会更新.Javascript字符串按值复制,因此如果更新原始变量,则不会更新对其的任何其他引用.

• https://codeburst.io/explaining-value-vs-reference-in-javascript-647a975e12a0

按值复制的字符串示例:

chosenIpAddress = "";
x = chosenIpAddress; // x is ""
chosenIpAddress = "localhost"; // chosenIpAddress is "localhost", x is still ""
// This same issues applies to imports/exports.

所以在你的ip地址文件中做这样的事情:

let chosenIpAddress = "";

function chosenTank(tank) {
    socket.emit('chosen tank', tank);
    console.log('Tank', tank);
    chosenIpAddress = tank.IpAddress;
}

function getChosenIpAddress() {
    // This can be "" if chosenTank is not called first
    return chosenIpAddress;
}

export {
    getChosenIpAddress,
};

另外,正如评论中所指出的,你需要chosenTank在访问之前调用chosenIpAddress,或者每次都要获得一个空字符串.

此外,您还需要将套接字字符串构建为函数,以便从getChosenIpAddress调用它时获取最新值:

import {getChosenIpAddress} from './socketEvents.js';

function getChosenSocket() {
    return socketClient(`http://${getChosenIpAddress()}:8081`);
}