我想使用spread运算符.场景是没有玩家(在UI上显示为玩家牌).每当我点击任何播放器磁贴时,它就会变为活动状态(突出显示).条件是一次只能突出显示一个玩家.所以,当一个球员瓦片被点击它的属性ifActive: true,和其他玩家属性ifActive: false
将playerReducer越来越点击玩家ID为action.payload(action.payload所赐这是目前点击播放器的ID).现在我必须修改我state而不改变它.我必须使用spread运算符.如何使用spread运算符修改索引处的特定对象？
const initialPlayerState = {
tabs: [
{ id: 1, name: 'player 1', ifActive: false },
{ id: 2, name: 'player 2', ifActive: false },
{ id: 3, name: 'player 3', ifActive: false },
]
}
const playerReducer = (state = initialPlayerState , action) => {
switch (action.type) {
case SELECT_PLAYER:
//how to modify state using spread operator, and how to modify
//a specific object at …我有一个看起来像这样的对象：
state: {
"1": {
"show": false,
"description": "one",
"children": {
"1": { "show": false, "description": "one" },
"2": { "show": false, "description": "one" }
}
},
"2": {
"show": false,
"description": "one",
"children": {
"1": { "show": false, "description": "one" },
"2": { "show": false, "description": "one" }
}
}
}
我有一个 for 循环，可以将子项“show”属性更改为相反的布尔值。所以我尝试用这个来更新值，但没有成功。
for (var childKey in state[appClassId].children) {
newState = {
...state,
[appClassId]: {
children: {
[childKey]: { ...state[appClassId].children[childKey], show: !state[appClassId].children[childKey].show}
}
}
“appClassId”变量是我从操作中获取的变量。
如何更新子属性中的每个键，例如 state.1.children.1.show
忽略这是一个不好的add功能.这是一个关于在TypeScript中使用带有扩展语法的数组解构的问题.
这就是我正在尝试的
const add = ([x,...xs]) => {
if (x === undefined)
return 0
else
return x + add(xs)
}
console.log(add([1,2,3])) //=> 6
但我不知道如何添加TypeScript类型.我最好的猜测是做这样的事情(最直接的翻译)
const add = (xs: number[]): number => {
if (xs[0] === undefined)
return 0;
else
return xs[0] + add(xs.slice(1));
};
console.log(add([1,2,3])); // => 6
这两种职能的工作,但在打字稿我失去解构阵列参数,函数体被junked了像一堆难看的东西的能力,并xs[0]与xs.slice(1)-即使我这些抽象到自己的职能,这是除了点.
是否可以在TypeScript中添加类型来解构扩展参数？
到目前为止我尝试过的
这样的东西适用于固定数组
// compiles
const add = ([x,y,z]: [number, number, number]): number => ...
但当然我需要可变长度数组输入.我试过这个,但它没有编译
// does not compile
const add = ([x, ...xs]: …我的 React 应用程序中有一个 HOC，这里是代码。
export function checkToken<Props>(WrappedComponent: new() => React.Component<Props, {}>) {
return (
class PrivateComponent extends React.Component<Props, LocalState> {
constructor() {
super();
this.state = {
isAuthed: false
}
}
async componentDidMount() {
let token = localStorage.getItem('dash-token');
let config = {
headers: { 'x-access-token': token }
}
let response = await axios.get(`${url}/users/auth/checkToken`, config)
if (!response.data.success) {
localStorage.removeItem('dash-token');
browserHistory.push('/login');
} else {
this.setState({isAuthed: true});
}
}
render() {
let renderThis;
if (this.state.isAuthed) {
renderThis = <WrappedComponent {...this.props} />
}
return ( …我有3个具有相同数据的对象，但内部数组具有单独的服务和提供ID，因此我尝试获得如下所述的预期结果， 请在此处检查我的尝试。提前致谢
对象1：
const obj1 = {
bid : 1,
mobile : 9533703390,
services : [
{
service_id : 5,
offer_id : 10,
count : 1
}
]
}
对象2：
const obj2 = {
bid : 1,
mobile : 9524703390,
services : [
{
service_id : 8,
offer_id : 12,
count : 1
}
]
}
对象3：
const obj3 = {
bid : 1,
mobile : 9524703390,
services : [
{
service_id : 5,
offer_id : 10,
count : …我正在根据此处解释的条件将元素推送到数组http://2ality.com/2017/04/conditional-literal-entries.html
const arr = [
...(cond ? ['a'] : []),
'b',
];
现在，这很好用，但是当我尝试时
const arr = [
...(cond && ['a']),
'b',
];
相反，它停止工作。
我想知道为什么它不再起作用，以及是否有办法使用扩展运算符和 && 而不是 ? 有条件地推送。
谢谢
我正在尝试使用扩展运算符更新对象的嵌套值。这是我第一次使用它，我相信我已经接近实现我的最终目标了，但我似乎无法弄清楚接下来我真正需要做什么。
我有一个结构如下的数组：
[
{
name: "Category 1",
posts: [
{
id: 1,
published: false,
category: "Category 1"
},
{
id: 2,
published: true,
category: "Category 1"
}
]
},
{
name: "Category 2",
posts: [
{
id: 3,
published: true,
category: "Category 2"
},
{
id: 4,
published: true,
category: "Category 2"
}
]
}
]
单击按钮时，我尝试更新已发布的值，当我使用 React 时，我需要设置状态。所以有人建议我使用扩展运算符进行更新。
onPostClick(post) {
post.pubished = !post.published;
this.setState({...this.state.posts[post.category], post})
}
如果我注销结果，{...this.state.posts[post.category], post}我可以看到已发布的内容正在添加到形成的父级中：
{
name: "Category 1",
published: false,
posts: [
... …假设我有一个对象：{a: 'A', b: 'B', c: 'C'}并且我想从中创建一个新对象，该对象具有相同的值，但我想设置c: 'D'.
它的语法是什么？我试过类似的东西：
{c: 'D', ...rest} = {...foo}
但这不是有效的语法。
我正在尝试使用传播运算符从对象中删除属性。传统上，我这样做：
const original_object = { prop1 : 'string1', prop2: 'string2' };
const { prop1, ...rest } = original_object;
在上述情况下，移除的属性（prop1）将不再存在于其余对象中。
假设有一个我想删除的更复杂的属性，例如对象中的一个对象。
const original_object = {
prop1: 'string1'
prop2: {
prop3: 'string3',
prop4: 'string4'
}
}
const { *remove prop3 of prop2 only here*, ...rest} = original_object;
console.log(prop3); // => 'string3';
什么是最优雅/最简单的解决方案？我希望除了对象之一之外prop3的所有东西都prop2以完全相同的结构包含在对象中。
我注意到 Object Spread 语法对于它可以接受的值类型非常宽松：
console.log({ ...true });
console.log({ ...false });
console.log({ ...0 });
console.log({ ...42 });
console.log({ ...-1 });
console.log({ ...NaN });
console.log({ ...'batman' });
console.log({ .../\w+[0-9a-fA-F]?/ });
console.log({ ...['foo', 'bar', 42] });
console.log({ ...undefined });
console.log({ ...false });
console.log({ ...Symbol('hmm') });
console.log({ ...Promise.resolve('resolved') });
console.log({ ...Promise.reject('rejected') });在对象字面量中传播时，是否存在无效的类型、类或值（即引发任何类型的错误）？当然，不包括未捕获的拒绝承诺。
spread-syntax ×10
javascript ×9
reactjs ×4
typescript ×3
ecmascript-6 ×2
object ×2
react-redux ×2
redux ×2
arrays ×1