SwiftUI`@ State`关键字有什么作用？

Question

该SwiftUI教程使用@State关键字来表示可变UI状态：

@State var showFavoritesOnly = false

它提供了以下摘要：

状态是一个值或一组值，可以随时间变化，并影响视图的行为，内容或布局。您可以将属性与@State属性一起使用，以将状态添加到视图中。

• 关键字的确切含义是什么？
• 变异@State变量如何导致视图重新计算？
• 其他变量在body吸气剂中如何不变？

Answer 1

该@State关键字是@propertyWrapper，最近刚刚在雨燕5.1中引入的功能。正如在相应提案中所解释的那样，它有点像价值包装程序，它避免了样板代码。

旁注：@propertyWrapper以前称为@propertyDelegate，但此后发生了变化。有关更多信息，请参见此帖子。

该官员@state文档具有以下的说：

SwiftUI 管理您声明为状态的任何属性的存储。 当状态值更改时，视图将使其外观无效并重新计算body。将状态用作给定视图的唯一事实来源。

State实例不是值本身；它不是值本身。这是读取和更改值的一种方法。要访问状态的基础值，请使用其value属性。

因此，当您初始化标记为的属性时@State，您实际上并不是在创建自己的变量，而是提示在后台SwiftUI创建“东西”来存储您设置的内容并从现在开始对其进行监视！您@State var只是充当访问此包装器的委托。

每次您的@State变量被写入时，SwiftUI就会知道它正在监视它。它也将知道是否@State变量被读出从View的body。使用此信息，它将能够重新计算View@State在body对该变量进行更改之后在其变量中引用任何变量。

Answer 2

如果你了解 React Native，让我添加一些其他内容。

该@State属性非常类似于this.stateReact Native 中的对象。

例如：

struct Foobar: some View {
    @State var username = ""
}

class Foobar extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      username: '',
    };
  }
}

当您修改用户名变量时，它们将具有相同的效果，即重新呈现当前页面。

Answer 3

WWDC 视频中的一个例子很好地解释了它- Session 204（从 16:00 开始，报价从 20:15 开始）

@State变量的特殊属性之一是 SwiftUI 可以观察它们何时被读取和写入。因为 SwiftUI 知道它zoomed被读入了body，所以它知道视图的渲染依赖于它。这意味着 - 当变量更改时，框架将body使用新@State值再次请求。

该@State作为属性包装也阐述和合理的数据流通过SWIFT UI（5:38）WWDC VID为好。它展示了当我们需要一个不可变 ( struct) 中的可变值时它如何解决问题View。