SeverusYang的博客

直接看实例，在实际开发中，<view class="photo" :style="playerImg">，这里用v-bind方式绑定了js方法，通过method或者computed中定义如。之后，在uniapp的内置浏览器中，调用是正常的。不管是微信小程序浏览器还是实机，都无法正确展示图片，又或是说，无法识别图片路径。在样式属性中，而这是不被允许的。在 Vue 模板中，样式属性的绑定应该使用。这里我先后使用了{{ }}语法和`${}`插值语法，都未有明确效果。通过改变方法，将组件样式改为内嵌式，

permission_handler提供了获取安卓权限的方法，通过直接使用该模块可以直接监听用户是否授权相应权限。该模块可以请求获取蓝牙/外设/短信/通讯录/地理位置等等权限。找到工程路径下android/app/src/main/AndroidManifest.xml文件。和ListView组件联动有很棒的效果。确保在标签<manifest>内，<application>外声明。本文用到的package均来自官方提供的。获取用户授权需要在安卓的包内声明方法，以获取通讯录权限为示例，

服务器部署的是宝塔面板。后端开发人员没有配置Cors的大前提下，可以参考该文档。如果直接使用nginx就在nginx.conf文件配置下更改（应该是...目前还没改过）那么首先引入一个概念，

因为具有一定的Vue基础。所以在创建ReactCli方面，以及配置简单的main.tsx、App.tsx就不多说了。本文使用的是typescript + React，但使用 j s 的在配置路由方面依然通用。这里先说最新的Router版本方法，React Router V6，截至目前的话，版本好像是6.4.很多方法删了，也很多方法改了。在文末我会提一下..

一开始解决，思路大概是将数据存储到piniaStore中，但是interesting，刷新页面Store照样清空刷新，它并不是一个永久存在的仓库。本文重点解决刷新页面数据丢失的问题，一般情况下，调试过程中，数据会变空；这对于敏感信息如用户的登录状态和访问令牌是很重要的，因为它们应该在用户结束会话后立即失效。这使得它适合存储持久化的数据，如用户的偏好设置和本地缓存的数据，以便在用户下次访问网站时仍然可用。对于服务器返回的用户登录信息（用户名、密码、token等），一般建议将敏感信息存储在客户端的。

Vue重要的写在前面、因为我是在学习过程中徐徐渐进地部署的环境。本来是打算只vue的，结果想上传到云服务器让大家都看到，于是开始学搭建 阿里云 服务器；然后因为有点Linux的底子，就搭建的Linux的操作系统的环境；虽然是大多情况用的宝塔面板进行的项目上传，但是所有的Bug飘红，加起来也真够喝一壶了。本文主要用来记录所有开发环境下的报错异常。供他人参考。具体的代码不做过多解释。Vue因为我一开始使用的是从 vite.config.js中配置路径，就像这样看似没有问题，并且在本地服务器上正常运行。

而chatGPT解释到，”唉你这个地方定义的表单，后台python没法解析啊。python的request.json只能解析JSON格式的数据。ImmutableMultiDict类似于Python中的字典，但它可以包含具有相同键的多个值。在这种情况下，它是不可变的（Immutable），即不允许对其进行修改。这篇文章，就是使用了JSON.s.....（单词忘了），然后转换的数据格式。你只要axios传的方式对了，就不愁后台拿不到。后台不需要做太多的修改，就是接收传值就ok了。这就是前端的代码了。

pycharm安装 mysql.connector。

如果此处不使用JSON.stringify进行解析，则服务端flask就需要解析。前端和服务端如果都不解析，则会报错。Vue的axios包自带JSON解析功能，但仅限于获取数据，因此发送数据时，还是需要解析后发送的。这里注意代码中的axios.post方法，相比较之前文章的方法。此处，我们虽然设置了传参param，但是如果直接提交，服务器会返回ERROR-415，不支持的媒体类型。之后，开启flask，服务器在端口5000运行。之后返回App.vue，渲染页面。在项目的app.py文件下，

相较于vue2，简化了过程，省去了单独return的步骤。

{{items}}

这就有点奇怪了，我看了一下浏览器的请求信息是 OK 的，参数都是有的，而且之前这样用 axios 也没有这个问题。然后，因为我们的参数是 JSON 对象，axios 帮我们做了一个 stringify 的处理。非常的刺激，这两种形式无一例外都触发了 axios 源码中【很关键】的那一段代码。那么这个是什么意思呢，这个是只能从请求的地址中取出参数，也就是只能从。但是这个接口是通用的，别人都用了，是 OK 的，接口没问题。我们知道在做 post 请求的时候，我们的传参是。的形式传递的，嗯，就是下面这两种形式。

三者之间任意一个与当前页面url不同即为跨域。vue-vite将拒绝此次GET或POST请求。说简单点，就是拒绝访问。跨域问题是vue-vite为了保护用户的信息安全设置的，当一个请求url的。此处定义了"/api"的路径为http：//xxxx，

因为Echarts的data中，带有value和name，所以这样存储，更符合Echarts的显示规律。如此，resArray数组就设置好了，直接让 data:resArray ， 就可以了。实际resArray存储的数据，就是[{value：XXX，name:''XXX''},{value:XXX,name:"xxx"}]不可以在Echarts的data中这样定义：data:[res.data.....]或者data:[resArray]使用for循环，遍历数组数据，并push到resArray中。

结果前台渲染成功，console.log(this.tableData)返回渲染了[1]，之后我又把console.log()这个命令放到了onShow(res)的第一行命令，同样也返回正确。因为如果在uniApp中使用axios，会产生跨域或者配置等各种问题，所以综合分析以后，我打算将这串代码修改为用uni.request这个uni自带的api解决问题。如果想在UniApp中使用更多的Vue3的Api，还需要根据实际情况，进行打包的配置处理。其实原本修改的方向很简单，但是我的出发点上来就错了。

这种方法适合数据都是在写死状态下的（企业开发应该没人用）；这里我省略了从数据库获取数据，详情参考axios获取数据。之后在数据方面其实有两种写法，这里我一开始用死数据进行的填充，所以用的第一种。但是实际开发中，使用到图表遍历的数据，应该都是动态数据。如果要用死数据，则是将数据全都写在data(){}里，之后调用方法，methods，去初始化echarts，我这有点懒，没再把数据分成Array，但是大致是这样，在draw_pieChart(){}这个方法中，之后，在mounted中调用就可以了。

如果用户输入了关键字，那么我们就启用检索：this.tableData.filter（），我们要根据{{this.applicant}}进行检索，则item.applicant.includes（this.searchValue)，即搜索applicant中包含this.searchValue的数据项。我们的目的是让用户在搜索框中输入用户名的关键字，实时展现搜索结果。这里我们已经用v-model=”{{searchValue}}"双向绑定了用户的输入内容，下面我们来写js部分。

临时笔记；如图示，红色框中的内容是可以通过左边按钮实现页面跳转的，但是整个页面的框架逻辑是不变的。在html中，这部分代码一般情况下是使用iframe实现，然而vue中好像不太支持这种方式。于是，我打算使用嵌套路由完成这部分功能。路由的配置比较麻烦。

本文仅供自己记录学习使用，文章出处来源@

但是为了防止新旧技术更替，企业的新技术未迭代，在弄懂新技术的同时，也不要忘了这些指令，在H5和JavaScript中，是如何实现的。因为毕竟是vue，vue的优点是组件代码分离，可以实现多处调用，但是就因为我这个优化...导致我后来频繁bug：不是数据传不到子页面，就是数据实时传值的过程把变量各种修改…因为这篇文章是在项目敲完之后创作的，所以我这里先说云端数据获取的部分，其实上述说的v-model传值是完全可以使用的，而且能如期获得用户输入的字符；我App.vue的父组件中获得了天气的数据，交给了res；