实习日记2第二周——第三周统一记录很多时候项目启动失败可能是node版本太高，不兼容代码依赖库的原因，有两种方案，我推

第二周——第三周统一记录

很多时候项目启动失败可能是node版本太高，不兼容代码依赖库的原因，有两种方案，我推荐第一种：

第一种：安装nvm对node版本进行切换使用，（只在切换时命令一次即可）。
第二种：在yarn install之前先启动这个命令（$env:NODE_OPTIONS="--openssl-legacy-provider"）一次性的，每次都需要复制。

Vue.extend：（已经废弃）。

用法：创建一个构造函数，然后去new一个实例挂载在app上。
vue替代方案：createApp函数，vue.createApp(pro).mount('#app')

具名插槽 vue2和vue3用法： v2：直接在内层子组件中写slot="header" v3：子组件外层包裹一层template然后在tenplate中写v-slot:header
过滤器：v2 VS v3

v2 的过滤器 | ：过滤器允许你将一个值（在本例中是一个数组）传递给一个函数，并将函数的返回值插入 HTML，如dateFormat 这个过滤器可以用来按照指定的 'hh:mm' 格式来格式化日期/时间。

<i>{{[info.matchTime, 'hh:mm'] | dateFormat}}</i>

v3 有两种替代方案：计算属性

<template> <i>{{ formattedMatchTime }}</i> </template> 
<script> 
import { computed } from 'vue'; 
export default { 
    props: ['info'], 
    computed: { 
        formattedMatchTime() { 
           return this.formatDate(this.info.matchTime, 'hh:mm'); 
           }, 
       }, 
   methods: { 
       formatDate(date, format) { 
           // 在此处实现日期格式化逻辑 
           }, 
       }, 
   }; 
</script>

网站中分享生成海報功能如何實現？

先是const imageCanvas = canvas.toDaTaURL变成base64编码。
引用vant4的dialog组件，其中将64编码绑定到src属性，：src="imageCanvas"
网站中dataURLtoBlob、saveImage、onConfirm。