业务逻辑和 UI 逻辑有什么区别？

Question

我正在学习状态管理，flutter大部分时间遇到单词business logic ui logic，有一段时间presentation logic，我在互联网上搜索它，人们用不同的语言解释它，我无法更好地理解，有人可以展示这三种类型logic以一个例子的形式解释它很干净和容易吗？

Answer 1

当我们使用一个库时，将它与我们代码的关键部分（即业务逻辑）分开是我们的责任和使命。
例如，在尊重这些原则的 Clean Architecture 中，目标是将关注点和角色分开，可以分为：
1）UI（用户界面）
2）格式化程序（格式、法律部分、内容）
3）业务逻辑（业务规则）
4) 数据（可以是内存中、API 等网络或在线数据库或本地持久存储/数据库）

在 UI 部分使用像 flutter 这样的跨平台/多平台解决方案可能比在业务部分更合乎逻辑。
业务逻辑不会经常变化，但在开发 UI 时可能会经常变化。
例如，对于网络调用，我们可以自己实现这一层，也可以依赖知名库。如果明天出现更好的新版本，我们只需要替换我们层的实现，而不会影响整个模块或项目。
有时，当客户说应用程序需要具有相同功能的新 UI 时，这可能是按照大多数只需要更改 UI 的方式构建的，而不会影响后面的功能逻辑。
在flutter的上下文中，考虑一个基本的按计数增量应用程序的例子，逻辑应该是分开的（可能在其他类/文件中）所以如果我们需要将按1、2、3次按改为a、b ,c... 次按，唯一的业务逻辑应该改变。
按照下面的例子：

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 65;
  String hello = "a";

  // the only business logic change will be here...No UI change require
  void _incrementCounter() {
    setState(() {
      hello = String.fromCharCode(_counter);
      if(_counter!=90)
        _counter++;
      else
        _counter = 65;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$hello',
              style: Theme.of(context).textTheme.headline4,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ),
    );
  }
}

还是没搞懂，参考以下：
（1），（2），（3）