Qt下使用OpenCV截取图像并在QtableWidget表格上显示-CFANZ编程社区

一、css

1.css中的样式优先级顺序

！important > 内联样式 > ID 选择器 > 类选择器 = 属性选择器 = 伪类选择器 > 标签选择器 = 伪元素选择器 > 通配选择器

（内联样式） > （内部样式） > （外部样式）

2.如何使一个盒子水平垂直居中？

（1）flex布局：

display: flex;
align-items: center;
justify-content: center;

（2）position定位：

父元素：绝对定位

子元素：相对定位，会将元素都转为行内块

调整子元素的位置的方法：

子元素left:50%;top:50%,
   无需宽高transform:translate(-50%,-50%)
   需要宽高，margin-left/margin-top子元素宽高的一半
子元素left:0;top:0;right:0;bottom:0
   需要宽高，margin:0,auto;

（3）grid布局：

display:grid;
place-item:center;

3.CSS中有哪些隐藏页面元素的方法?

（1）利用display：none来实现

（2）利用visibility:hidden隐藏元素

（3）利用opacity:0

二、js篇

1.数组中foreach和map的区别

（1）相同点

都是循环遍历数组中的每一项。
每次执行匿名函数都支持三个参数，参数分别为item(当前每一项)，index(索引值)，arr(原数组)。
匿名函数中的this都是指向window。
只能遍历数组。

（2）不同点

map()会分配内存空间存储新数组并返回，forEach()不会返回数据。
forEach()允许callback更改原始数组的元素，map()返回新的数组，map() 不会对空数组进行检测。

2.数组中常用的方法有哪些

（1）Array.push()，向数组的末尾添加一个或多个元素，并返回新的数组长度。原数组改变。

（2）Array.pop()，删除并返回数组的最后一个元素，若该数组为空，则返回undefined。原数组改变。

（3）Array.unshift()，向数组的开头添加一个或多个元素，并返回新的数组长度。原数组改变。

（4）Array.shift()，删除数组的第一项，并返回第一个元素的值。若该数组为空，则返回undefined。原数组改变。

（5）Array.join()，将数组的每一项用指定字符连接形成一个字符串。默认连接字符为 “,” 逗号。

3.如何获取数组中的最后一个元素

（1）pop()方法：pop()方法，删除数组最后一个元素，并返回该元素，所以利用这个方法可以取到数组的最后一个；

（2）length方法：

let arr=["1","2","3"];
console.log(  arr[ arr.length-1 ]  );    // "3"

（3）slice方法：在数组上使用slice(-1)就可以获取数组的最后一个元素了。(-1 指最后一个元素，-2 指倒数第二个元素)

let arr=["1","2","3"];
console.log(  arr.slice(-1)   );     //  ["3"]

4.let和const的区别

（1）const 用于声明一个常量，即不可改变的变量。这意味着你不能再次对常量进行赋值，否则会抛出一个错误。但是，如果常量声明的是一个对象，你仍然可以修改对象的属性。

（2）let 用于声明一个变量，允许你对变量进行重新赋值。

5.cookie和localstore和sessionstore区别

（1）相同点：cookie、sessionStorage和localStorage都用在客户端存储数据，每一个都有自己的存储和到期限制。

（2）不同点：

存储大小：cookie数据大小不能大于4K；localStorage和sessionStorage则可以达到5M
有效时间：cookie在设置的有效期内一直有效；localStorage存储持久数据，只要不手动清除则一直存在；sessionStorage数据在当前浏览器关闭后就会被自动清除

三、vue

1.vue2和vue3的区别

（1）双向数据绑定原理不同

Vue2 的双向数据绑定是利用ES5的一个APIObject.definePropert() 对数据进行劫持，结合发布订阅模式的方式来实现的。
Vue3 中使用ES6的Proxy API对数据代理。

（2）API 类型不同

Vue2 使用选项类型api,选项型api 在代码里分割了不同的属性：data,computed,method等。
Vue3 使用合成型api,新的合成型api 能让我们使用方法来分割，相比于旧的api 使用属性来分组，这样代码会更加简便和整洁。

（3）定义数据变量和方法不同

Vue2是把数据放到了data 中，在 Vue2中定义数据变量是data(){},创建的方法要在method:{}
Vue3 就需要使用一个新的setup()方法，此方法在组件初始化构造的时候触发。使用以下三个步骤来建立反应性数据：1）从vue 引入 reactive；2）使用 reactive ()方法来声明数据为响应性数据；使用setup()方法来返回我们的响应性数据，从而template 可以获取这些响应性数据。

（4）生命周期钩子函数不同

Vue2 中的生命周期：beforeCreate 组件创建之前；created 组建创建之后；beforeMount 组件挂载到页面之前执行；Mounted 组件挂载到页面之后执行，beforeUpdate 组件更新之前；updated组件更新之后
Vue3 中的生命周期：setup 开始创建组件；onBeforeMount 组件挂载到页面之前执行；onMounted 组件挂载到页面之后执行；onBeforeUpdate 组件更新之前；onUpdated 组件更新之后；而且 Vue3 生命周期在调用前需要先进行引入。除了这些钩子函数外，Vue3 还增加了 onRenderTracked 和onRenderTriggered 函数。