不疯狂不成魔

原创 Vue3-19 hooks 前端数据和方法的封装

export default 值（值包含数字，数组，对象，函数）await 处理错误请求，用 try catch 包住。hooks 中还可以写钩子（Vue的生命周期函数）hook就是把相关的数据和方法进行模块化封装。axios必须用await吗，为什么。这个是管网络请求的，需要安装。await 只能等到成功；就是一些js/ts 文件。

原创 Linux-14 ubuntu 安装 vscode

官网下载vscode安装包

原创 Vue3-18 生命周期（vue2+vue3）

我们调用的是onBeforeMount() 函数，里面的函数是我们指定的vue在合适的时机调用的。销毁（销毁前 beforeDestroy()，销毁完毕 destroyed()）创建（创建前 beforeCreate()，创建完毕 created()）更新（更新前 beforeUpdate()，更新完毕 updated()）挂载（挂载前 beforeMount()，挂载完毕 mounted()）挂载需要引入，同时跟vue2的区别是在前面加on，同时驼峰命名法。组件的生命周期（组件的一生）

原创 Vue3-17 父子组件使用props传值

如果使用ts，在里面写的是具体的对象名，只能具象导入如果对象文件命名为index.ts，就可以写导入到文件目录，不用具体到具体的对象名为什么可以这么做？这是因为 JavaScript/TypeScript 的模块解析规则，特别是 目录索引文件（index file）​ 的机制：当导入一个目录时，Node.js/TypeScript 会自动查找该目录下的 index.js或 index.ts文件。查找 @/types发现 types是一个目录查找目录下的 index.ts文件。

原创 【模板】Jinja风格 Ruby风格

模板引擎（Template Engine）​ 是一种软件组件或库，它的核心作用是将数据模型（通常是程序中的变量或对象）与预定义的模板（通常是包含占位符的文本文件）结合起来，生成最终的、格式化的输出文本。创作者：它是 Ruby 之父 松本行弘（Yukihiro Matsumoto）​ 设计的，是 Ruby 语言“在字符串中嵌入代码”这一理念的早期体现。你提供一个模板（“填空题的卷子”），再提供一些数据（“填空题的答案”），模板引擎就会自动把答案填到卷子的对应位置，生成一份完整的文档。简单来说，它就是一个“

原创 Vue3-16 控制台警告 Feature flag __VUE_PROD_HYDRATION_MISMATCH_DETAILS__ is not explicitly defined.

这个警告是 Vue.js 3​ 在开发环境下出现的，它告诉你编译时特性标志（feature flags）没有被明确定义。这个警告是什么意思？

原创 Vue3-15 html标签和组件上的ref属性 + 接口泛型

vue 页面中的style加上 scoped就是局部样式的意思，样式只在当前页面上有效果，建议每个写都加上 scoped.html 元素上加ref，需要在script中创建一个同名的变量存储标记的内容，拿到的是dom元素。如果父组件想要看子组件的内容，需要子组件主动暴露才行，要使用defineExpose暴露内容。定义的ts数据类型中，为什么类型用小写，大小写的区别呢？在导入时，@表示在路劲的根目录，也就是src所在的位置。组件上加ref，获取的是这个组件的实例。定义一个接口类型的数组，使用泛型。

原创 Vue3-14 watch监视对象及对象属性，watchEffect

他们修改的是属性，对象的地址值是没变的，等到打印的时候，拿到的就是最新的数据了。watch 监听对象的话， 监听的是对象的地址值的变化，不是对象某个属性的变化。监视reactive对象，默认是开启深度监视的，是不能关闭的。右边reactive相当于人没换，只是换了属性。监听对象前后的值为什么是相同的？左边ref相当于替换了整个人；

原创 odoo-094 self.env 主要属性和方法

在Odoo中，self.env是 Environment类的实例。

原创 Vue3-13 watch监视 ref 定义的数据

左边是vue3导入的；右边是vue2中使用watch方法的；监听的对象：ref定义的数据sum，不是sum.value.ref的对象数据，监听的是对象的地址值的变化，不是对象属性的值的变化；若想监视对象内部的数据，要手动开启深度监视watch的第三个参数是监听的配置项：deep:true 深度监视immidate:true 立刻监视，先执行下监听的函数。

原创 Vue3-12 vue2与vue3中的computed

v-bind 单向绑定，可简写为:value=‘firstName’v-model双向绑定，或者v-model=‘’计算属性页面上直接使用就行。计算属性计算出来的也是ref定义的数据。方法没有缓存，计算属性有缓存。

原创 odoo-093 Markup 相关的使用

markupsafe是一个专门用于安全处理 HTML/XML 字符串的 Python 库，主要目的是防止跨站脚本攻击（XSS）。Markup：标记安全内容，避免转义。escape：转义特殊字符，防御 XSS。escape_silent：转义字符并安全处理 None值。这些工具在 Web 开发（尤其是使用 Jinja2 模板时）中至关重要，能有效提升应用安全性。场景是否需要说明Web应用处理用户输入必须​防止XSS攻击使用Jinja2模板自动包含​Jinja2依赖markupsafe。

原创 Vue3-11 toRefs 和 toRef

toRefs 把reactive 对应的所有key val解构出来，并且具有响应式能力。toRef 把reactive 对应的一个key val解构出来，并且具有响应式能力。vscode 的设置配置 Vue ，勾选自动写.value。同时选中多个一起修改为多个相同内容的快捷键 -试了下，可以自己写，写了后按哪个键呢？按住alt键可以同时选中多个。Vscode的快捷键。

原创 odoo-092 Qweb模板中的t-esc, t-out, t-raw

t-esc (最安全) → t-out (中等) → t-raw (最危险)t-esc (强制转义) → t-out (条件转义) → t-raw (不转义)首选 t-esc → 次选 t-out → 尽量避免 t-raw。

原创 odoo-091 启用debug模式的几种方法

在这里插入图片描述](https://i-blog.csdnimg.cn/direct/5e23afa30533475ab609a09cedc6f268.png)Odoo Debug 浏览器扩展可以在浏览器工具栏添加一个图标，用于一键切换开发者模式。💡 提示 按下 Ctrl + K 或 Cmd ⌘ + K 打开命令面板，然后输入 “debug” 可激活带资源的开发者模式或停用该模式。, 安装后可以在右上角用户右键菜单中切换启用/取消开发者。同时，开发者工具如下，可以取消开发者模式。

原创 odoo-090 odoo群组系统管理中 设置 和 访问权限 的区别

版本：odoo13。

原创 【前端基础】04-XSS（跨站脚本攻击，Cross-Site Scripting）

一个用户的恶意输入会威胁所有用户，是因为恶意内容被存在数据库里，每次其他用户访问页面时，后端都会把恶意内容读出来，浏览器误把它当作代码执行。XSS​ 是一种常见的 Web 安全漏洞，攻击者通过在网页中注入恶意脚本，当其他用户访问该网页时，恶意脚本会在用户的浏览器中执行。XSS 最危险的地方：用户不需要任何点击，只要打开页面，恶意脚本就会自动执行。只要恶意代码被拼接到 HTML 中，浏览器就会在加载页面时自动执行。防御关键：永远不要直接把用户输入拼接到 HTML 中，一定要转义！

原创 【前端基础】03- .stop VS .prevent

当默认行为不满足需求时，开发者可通过 .prevent（Vue）或 event.preventDefault()（原生 JS）覆盖它们，实现自定义逻辑。

原创 Vue3-10 ref与reactive创建响应式数据的区别

如果ref包含一个对象，实际上值value还是用Proxy(Object)对象，是reactive处理的。reactive 实际是一个Proxy(Object) 对象。ref : 可以定义：基本类型、对象类型的响应式数据。reactive： 只能定义对象类型的响应式数据。

原创 odoo-089 odoo18 严格的版本version检查

为了方便记录同时知道是否同步更新，把版本加上了日期，结果再次启动报错。报错时的version数据如上，去掉即可。

原创 Vue3-09 创建响应式数据(基本类型ref和对象类型reactive)

vue3 中想要哪个数据是响应式的，就用ref包下。响应式：数据一改页面就要同步变的就是响应式的。这里的冒号简写相当于 v-bind:,省略了。vue2 中数据写在data中就是响应式的。vue2中的这个ref vue3中的不一样。模板中展示数据，不需要写.value。但在所有js中修改需要写.value。控制台上看见是Proxy类型的就是。写了v-for最好再写key标识。

原创 Vue3-08 setup 语法糖

【代码】Vue3-08 setup 语法糖。

原创 Vue3---Vue.js Devtools 插件安装

lChrome 浏览器输入：chrome://extensions/也可以安装在 Edge 浏览器。

原创 odoo-088 不同用户打开有权限组控制的视图

这个视图看到这个视图是有权限组限制的，在继承的时候也要加上权限组才行。admin 打开菜单。

原创 Vue3-07 setup 与 Options API 的关系

data, methods 可以和 setup同时存在，但是不建议这么写setup能否读取data中的数据setup是最早的生命周期data 可以读取 setup中的变量，反之不行。

原创 Vue3-06 setup() 函数及返回值

在vue2的beforecreate之前执行，下图精简注释。Vue3 中的setup 没有维护 this。vue3的小升级：可以写多个 同名的组件。key和val相同，触发简写形式。这里不是响应式的数据。

原创 odoo-087 安装 npm （node ok npm not）

重要提示：如果仅部署标准Odoo系统（不进行前端定制开发），从Odoo 12开始完全可以不安装Node.js。尝试odoo是否可以正常使用，卸载前知道odoo18，17，13在正常使用，15-16的环境很久没有使用过了。Odoo部分版本会使用Node.js，但并非核心依赖，主要用于前端资源编译（如Less/Sass预处理）。还有一个问题，odoo在Firefox又打不开了，问题同上次的，解决如下。odoo18 新搭建的环境，没安装模块，还可以正常启动和访问。再看odoo运行情况，只看有问题的几个版本的。

原创 Vue3-05 Vue2 OptionsAPI 选项式API VS Vue3 CompositionAPI 组合式API

原创 Vue3-04 自定义组件Person

1. 为什么 Vue 文件中的 script 中需要 export default?# 控制台的Vue插件。

原创 Vue3-03 熟悉src文件夹及Vue文件格式

Vite项目中，index.html是项目的入口文件，在项目最外层。加载index.html后，Vite解析指向的JavaScript。Vue3**中是通过 **createApp函数创建一个应用实例。问题:1. 怎么在vscode 中进行ts 语法检查,不符合给与波浪线警告。

原创 Vue3-02 脚手架创建项目及文件解释作用

Vue cli 脚手架是基于webpack 快速创建的，是vue2的创建项目脚手架命令。npm -i 安装所有的依赖，多了一个node_modules文件夹，也不红色警示。Vue是直接准备后，然后根据访问的路由，需要哪个加载哪个页面；(使用相同的版本，发现我创建的里面的跟看视频的文件不太一样)没有node_modules，没有依赖，所以红色波浪线。ts的配置文件，三个，不要动，删掉后ts出问题。安装vscode，确定后都是下一步。这个文件的作用：让ts去认识文件。对工程的简单介绍，可以删掉的。

原创 Vue3-01 Vue3 开始

原创 Linux-13 火狐浏览器书签丢失解决

今天电脑开机后，发现火狐浏览器的书签找不到了，如下图提示。第二种，刷新浏览器后书签回来了，下面是每个步骤的截图记录。第一次遇见，以前都是Chrome浏览器丢书签的。经常遇见很多奇怪问题，解决这些都要花不少时间的。根据下方官方提供的帮助文档，两种方法读尝试了。第一种，到最后没有找到官方说的文件，失败；而且新的书签也不能保存了。

原创 odoo-086 The page isn‘t redirecting properly

在Firefox 浏览器访问报上述错误（清除缓存后还是会报错的）在浏览器的网络设置里，代理设置为无代理模式，还是不行。把所有时间内的session都清理掉，可以了。换个浏览器Chrome可以正常访问。使用Firefox的无痕模式可以。

原创 odoo-085 psycopg2.errors.UndefinedTable: relation “partner_tickets_history_sh_helpdesk_ticket_rel“ d

oodo 的模块命名有限制，如果太长转换成数据库表名，或者是写2many字段自动生成关系表的话，就会导致因为表名超过长度导致的

原创 odoo-084 odoo log 提示的一些 WARNING

【代码】odoo-084 odoo log 提示的一些 WARNING。

原创 odoo-083 DeprecationWarning: Since 17.0, deprecated method, read display_name instead

方法，返回的时候调用。

原创 odoo-082 res.config.settings（配置设置）和 ir.config_parameter（系统参数） 的关系

string='自动确认订单',config_parameter='sale.auto_confirm', # 存到冰箱ir.config_parameter是存储，res.config.settings是界面字段要有 config_parameter参数才能自动保存所有值都存为字符串，使用时需要类型转换配置键名要唯一，建议用 模块名.参数名格式任何地方都可以通过 ir.config_parameter读取配置记住个简单原则：设置界面只是菜单，数据库才是冰箱。

原创 odoo-081 res.config.settings 参数-implied_group

参数，给用户赋予的什么权限，赋予什么权限就写哪个权限组的名字，要加上模块名的。如果在用户中已有这个权限，那么这两个字段是可以同步结果的，点击一个另一个也会跟随。还需要单独在 制造-设置 中写为了把用户按模块分配权限。

原创 Git --- Local Changes Prevent from Pull

本地新增了一个文件，回滚后，本地看不到这个文件，但是pull的时候还是提示本地有这个问题，导致pull 失败。