字符串与State变量拼接生成URL报错，请求排查错误原因

我来帮你拆解这段代码里的问题，其实是两个基础语法错误导致的运行报错：

• 错误的对象字面量包裹：你用{}把整个URL字符串拼接表达式包起来了，这会让JS把它解析成一个对象，但里面的内容并不是合法的对象键值对结构，完全没必要加这个外层大括号。
• 多余的变量插值大括号：在普通JavaScript代码中（不是JSX的模板场景），拼接变量不需要用{}包裹，直接引用this.state.city和this.state.sport即可。另外更推荐用ES6模板字符串来做URL拼接，可读性更强，也不容易出错。

修正后的代码示例 #

方式一：普通字符串拼接

var url = "http://localhost:3000/get-players/" + this.state.city + "/" + this.state.sport;

方式二：ES6模板字符串（更推荐）

var url = `http://localhost:3000/get-players/${this.state.city}/${this.state.sport}`;

模板字符串用反引号（）包裹，变量通过${变量名}`的方式插入，写法更简洁直观，也能避免字符串拼接时的引号、加号遗漏问题。

内容的提问来源于stack exchange，提问作者hitesh