useEffect挂钩取决于对象/数组

时间:2019-11-19 11:28:16

标签: reactjs react-hooks

useEffect与基元可以很好地工作,但是当数组值更改时,例如,我需要它运行。我有props.items,然后加载了项目,但某些ID不同。我试图这样使用它:

useEffect(() => {
}, [...props.items.map((i) => i.id)])

但是该解决方案引发了来自react的错误,表示依赖数组不能在调用之间改变。 有人设法找到这种情况的可靠解决方法吗?预先感谢。

1 个答案:

答案 0 :(得分:2)

struct _LoginView: View {
    var body: some View {
        NavigationView {
            Color.green
                .edgesIgnoringSafeArea(.all)
                .overlay(
                    VStack(alignment: .center, spacing: 15) {

                        Image("Bg")
                            .resizable()
                            .scaledToFill()
                            .frame(width: 130, height: 130, alignment: .center)
                            .clipShape(Circle())

                        Spacer()


                        Button(action: {
                            print("button clicked")
                        }) {
                            NavigationLink(destination: _LoginViewMain()) {
                                Text("SIGN IN")
                                    .frame(minWidth: 0, maxWidth: .infinity)
                                    .font(.system(size: 18))
                                    .padding()
                                    .foregroundColor(.white)
                                    .overlay( RoundedRectangle(cornerRadius: 25)
                                        .stroke(Color.white, lineWidth: 2)
                                )
                            }
                        }


                        Button(action: {
                            print("btn cliecked")
                        }) {
                            NavigationLink(destination: _LoginViewMain()) {
                                Text("SIGN UP")
                                    .frame(minWidth: 0, maxWidth: .infinity)
                                    .font(.system(size: 18))
                                    .padding()
                                    .foregroundColor(.green)

                            }
                            .background(Color.white)
                            .cornerRadius(25)
                        }
                    }

                    .frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity)
                    .padding([.leading, .trailing], 30)
                    .foregroundColor(Color.green)
                    .padding([.top, .bottom], 100)
            )
        }
    }
}