vue3 项目实现兼容pc和H5的基本实现

先来抛出一个简单的问题:

如果我们的750的设计稿上面,有一个375px,那么这个元素在750的屏幕上面就是宽度的一半,那么,如果我们设置为375px,在375px的设备上面,就沾满了屏幕,而不是屏幕的一半了,那我们应该如何实现呢?

大家不要说用百分比,我们也不讨论视口宽度单位,我们今天聊一聊rem这个单位。

rem 是 CSS 中的一个长度单位,全称是 “root em”。它是相对于根元素(即HTML元素)的字体大小来计算的。例如,如果 HTML 元素的字体大小是 16px,那么 1rem 就等于 16px。如果 HTML 元素的字体大小改变,那么使用 rem 作为单位的元素的大小也会相应地改变。

那么,我们在750的设备上面,更元素的字体大小设置为100,就是1rem=100px,在375的设备上面,设置为50,就是1rem=50px,这样,我们就可以实现不同设备上面的元素宽度自适应了。

阅读更多

kiny-mathtype-katex渲染

富文本编辑器集成数学公式的解决方案,并且在小程序中显示。

解决的问题: 1.直接用 latex 写公式,在小程序中直接显示。 2.富文本编辑数学公式,在小程序中显示。

阅读更多

vue-Router

任何框架的学习,要想学习好,首先必须全部了解最基本的 api,然后才是框架的封装,框架的优化,框架的底层原理,框架的源码。

工作项目的开发没有问题,不代表你就已经完全了解了vue-Router,认真的研究文档的每一个细节,会保证你的开发思路更加清晰,开发效率更高。

阅读更多

简单实现模拟 vue 的数据响应

主要实现的是修改对象里面的属性,从而使得页面中的显示改变。

采用的是:

  1. Object.defineProperty 这个属性来监听对象属性的改变
  2. window 设置一个变量,来记录当有属性改变的时候,将需要调用的函数记录一下
  3. set 中,当数据属性修改的时候,for 循环来调用相关改变页面的的函数

阅读更多