1HXUqTekaB3P
1.介绍 上一篇文章分享了Vue3如何如何接入i18n 实现国际化多语言，这里继续和大家分享Flask后端如何接入i18n实现国际化多语言。 用户请求API的多语言化其实有两种解决方案： 后端返回："USER_ERROR" =>前端渲染："用户错误" 后端接收请求中"Accept-Language"信息为"zh-CN"=>后端返回："用户错误"=> 前端渲染："用户错误" 这里我们采用的是第二种方案，也就是后端直接处理i18n逻辑。 对于Flask我们常用flask-babel，这个包对于将原本单语言的程序转为国际化多语言非...
1.基本方法 在Vue.js3中实现网页的国际化多语言，最常用的包是vue-i18n，通常我们会与vue-i18n-routing一起使用。 vue-i18n负责根据当前页面的语言渲染文本占位符，例如： <span>{{t('Login')}}</span> 当语言设置为中文时，会将Login渲染为“登录”。 vue-i18n-routing负责将页面语言与URL绑定，例如： https://githubstar.pro/zh-CN/repo 表示访问中文版的/repo路径。 将不同语言的网页放在不同的URL下有助于SEO，因为可以在<head>部分添加...
1.字体图标与矢量图标 目前主要有两种图标类型：字体图标和矢量图标。 字体图标是在网页打开时，下载一整个图标库，通常可以通过特定标签例如<i>来使用，优点是方便地实现文字混排，缺点是包体积大，且难以自定义。 矢量图标本质是<svg>标签，包中只含有所需的图标，且很容易自定义，也可以选用不同图标库来源的图标，甚至可以用自定义SVG，缺点是与文字混排相对复杂。 本文推荐并主要使用矢量图标。 2.矢量图标源 目前比较全面的图标集： GoogleMaterialSymbols(之前的GoogleIcon)：比较现代化的图标集，包括圆角尖角图标集、空心实心图标集，主打交互图标，...
1.错误消息格式 前后端消息传递时，我们可以通过json的errors字段传递错误信息，一个比较好的格式范例为： { errors:{ global:["网络错误"], password:["至少需要一个大写字母","至少需要八位字符"] } } errors中，字段名代表出错位置（如果是输入框的话，对应错误要显示在框下面），内容为一个数组，每个字符串代表一个错误。 2.处理函数 可以新建一个composables文件夹，以存储各个components中共用的逻辑，例如错误消息处理。这里在composables文件夹中新建一个error.ts： import{ref,typeRef}from...