LeanCloud实现文件上传、图片信息状态管理
查找LeanCloud的案例，
我们的项目只会涉及到title，owner以及image即可。
官方实例如下：
回到models目录下的index.js开始仿写文件上传相关的状态管理。
页面的组件会使用这个接口以及状态，所以我们还要新增一个关于图片上传的store用来管理上传数据。
上传这里返回一个promise对象
至此实现了模型层面的逻辑。
受控表单与useRef简易上传
新建一个组件Uploader,准备做一个简单的上传功能，再进行拓展。
如何实现上传？
利用一个file类型的input让用户点击实现上传。 使用useRef给这个input进行标记，这样就可以通过ref来定位到它。
添加事件监听：
这时需要引入我们的上传逻辑，在stores目录下的index.js中暴露出来并在组件中
现在组件尚未被观察，还需要订阅这些信息。还要引入mobx的observer
使用antd的上传组件
我们只是使用antd的UI，逻辑还是使用我们自己的。
引入Dragger
在props中引入我们自己的上传逻辑并且返回 false来阻止自动上传。
现在上传成功以后没办法知道上传结果，所以继续优化
上传限制
增加一些上传逻辑：如果用户没有登录/注册那么是不能进行图片的上传，会出现一个提示用户登录的提示条。用户登录之后则会隐藏这个提示条。 方便起见，我们把这一部分单独划作一个组件Tips组件。
显示逻辑如下：如果用户登录了就什么都不显示，反之则显示Tips组件。
在Tips中引入我们的UserStore以及observer，并且通过styled-components进行样式调整
样式如下：
在上传逻辑中调整：在用户没登录的时候要执行上传失败
来到UpLoader组件，在执行逻辑中进行条件判断。
上传结果展示
上传结果展示这里也可以继续优化，可以展示文件名，文件的url变成一个可以点击的a链接，还有一个可配置大小的部分，并生成一个新的结果。
结果如下：
实现定制图片尺寸
我们用到了mobx中的useLocalStore管理本地状态。
现在还没有办法获取用户在input中输入的数字，所以使用useRef进行标记
在状态管理中新增设置宽高的逻辑。
出现了链接，但是无法做到更新
分别增加onChange事件
可以了同步更新了
