swift ui 数据绑定二传递结构体

2021-11-23  本文已影响0人  xq9527

前言 :

最近在学习iOS swift ui 里面的数据绑定 ,这是第二小节 传递结构体 想着分享给大家。

效果图:

image.png image.png

具体实现 :

struct ContentView: View {
    @State private  var  title:String="旋涡名人"
    var body: some View {
        VStack {
            Text(self.title)
                .padding()
            Button(
                action: {
                    self.title="宇智波佐助"
                }, label: {
                    Text("确定")
                        .font(.largeTitle)
                          .padding()
                          .background(Color.blue)
                         .foregroundColor(.white)
                          .cornerRadius(15)
                }
            )
        }

    }
}
struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

上面的代码片段我们简单分析一些 通常我们要在点击一个button的时候改变 标题的内容 我们可以像上面这样去操作 在action 属性里面去操作 可以理解为button点击事件里面去处理 这样虽然能实现需求但是随着我们需求变多 代码量变大我们不推荐这种方式

  self.title="宇智波佐助"

我们只需要self.title 将我们变量重新赋值 那么我们点击button之后 标题内容就会发生改变

import SwiftUI
struct HeadView:View{
    @Binding var title:String
    
    var counter:Int=0
    
    init(title:Binding<String>){
        self._title=title
        let sentence=self._title.wrappedValue
        self.counter=sentence.count
    }
    
    var body: some View{
        Text(self.title+"/\(self.counter)")
    }
}

struct ContentView: View {
    @State private  var  title:String="旋涡名人"
    var body: some View {
        VStack {
            Text(self.title)
                .padding()
            HeadView(title:self.$title)
            Button(
                action: {
                    self.title="宇智波佐助"
                }, label: {
                    Text("确定")
                        .font(.largeTitle)
                          .padding()
                          .background(Color.blue)
                         .foregroundColor(.white)
                          .cornerRadius(15)
                }
            )
        }

    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

我们通过属性包装器 将我们要显示的view 抽离出来 然后绑定到我们button点击事件上面 也能实现我们将代码更好解耦和抽离代码

最后总结:

swift ui 使用了 属性包装器 来时实现和其他语言的一样的数据绑定的效果 同学们有兴趣可以私下多研究。最后希望我的文章和笔记能帮助到各位同学学习和工作。

上一篇下一篇

猜你喜欢

热点阅读