pscool的博客

vue3 + ts 快速入门

1. 初始化脚手架说明Vue 脚手架是 Vue 官方提供的标准化开发工具（开发平台）。最新的版本是 4.x。文档: https://cli.vuejs.org/zh/。具体步骤第一步（仅第一次执行）：全局安装@vue/cli。npm install -g @vue/cli第二步：切换到你要创建项目的目录，然后使用命令创建项目vue create 项目名第三步：启动项目npm run serve 备注：如出现下载缓慢请配置 npm 淘宝镜像：npm confi

Promise学习案例

这个时候就可以当作这个dom的属性的初始值，下一帧把它移除掉了，也就没了v-enter这个类名了，那么属性又会变成默认值(如果没有特别设置的话)，并且v-enter-active这个类名也是在元素插入之前就添加进去了（也就设置了transition了），v-enter-to也是在v-enter移除时的那一帧加上去的，那么就满足CSS3产生过渡动画的条件了（1.指定了过渡属性，2.过渡属性发生了可计量的变化）。过渡动画完成之后，v-enter-active和v-enter-to这两个类名被删除。

'获取用户信息成功''获取用户信息成功''获取用户信息成功'

vue-zhihudaily-2.0 - 使用Vue2.0+vue-router+vuex创建的zhihudaily。node-vue-server-webpack - Node.js+Vue.js+webpack快速开发框架。vue-ssr-boilerplate - 精简版的ofvue-hackernews-2。vue-adminLte-vue-router - vue和adminLte整合应用。vue-shortkey - 应用于Vue.js的Vue-ShortKey 插件。

* 异步组件：当第一次切换到当前组件时候，才会去后台请求异步组件渲染函数，请求完了之后，下面这句代码才会执行，然后根据这个渲染函数创建组件实例 *//* 异步组件：当第一次切换到当前组件时候，才会去后台请求异步组件渲染函数，请求完了之后，下面这句代码才会执行，然后根据这个渲染函数创建组件实例 *//* 异步组件：当第一次切换到当前组件时候，才会去后台请求异步组件渲染函数，请求完了之后，下面这句代码才会执行，然后根据这个渲染函数创建组件实例 */'我是异步路由组件2 created''异步组件1...'

除了核心功能默认内置的指令 (v-model 和 v-show)，Vue 也允许注册自定义指令。可以注册全局指令和局部指令下面代码使用的是：注册局部指令，仅在当前组件中使用return {focus : {bind(el) {// 这里只能拿到el，拿不到el的父节点，因为还未插入 // el.focus() // 更不要说获取焦点了 } , inserted(el) {// 这里能拿到父节点 el . focus() // 这里能获取焦点 } } , demo : {

vue3的v-model指令

一个计算属性仅会在其响应式依赖更新时才重新计算。这意味着只要 author.books 不改变，无论多少次访问 publishedBooksMessage 都会立即返回先前的计算结果，而不用重复执行 getter 函数。更改此应用的 data 中 books 数组的值后，可以看到 publishedBooksMessage 也会随之改变。定义了一个计算属性 publishedBooksMessage。在模板中使用计算属性的方式和一般的属性一模一样。// 一个计算属性的 getter。计算属性默认是只读的。

app . component('Demo' , Demo) console . log('注册Demo组件成功');} }

* 2. 显式地使用了 setup 函数而不是 ，则事件需要通过 emits 选项来定义，emit 函数也被暴露在 setup() 的上下文对象上 */子组件可以触发自定义事件，父组件使用该子组件时，可以监听该组件的事件，并为监听的事件绑定事件处理函数，则当该子组件触发了该事件时，父组件对应的事件处理函数就会执行。/* 当通过触发子组件事件, 父组件监听到该组件的该事件, 修改了person的ref值, 从而组件会更新 */'---组件渲染更新了---'

可以将组件中定义的属性值（响应式数据）传给子组件，当这些属性值发生变化时，子组件也会更新重新渲染。看上去跟vue2没什么区别，就是先引入组件，然后注册组件，然后就使用组件。

vue3的插槽slots

vue2学习笔记

什么是hook？—— 本质是一个函数，把setup函数中使用的Composition API进行了封装。类似于vue2.x中的mixin。自定义hook的优势: 复用代码, 让setup中的逻辑更清楚易懂。

注意：v-model 会忽略任何表单元素上初始的 value、checked 或 selected attribute。它将始终将当前绑定的 JavaScript 状态视为数据的正确来源。vue3可以帮助我们将vue定义的变量绑定到html表单元素上，并且监听到html表单元素修改值时，会将对应的vue定义的变量修改。v-model 还可以用于各种不同类型的输入。注意：要加上下面的样式，才有换行效果哦。多个复选框绑定的是同一个数组或集合的值。单个的复选框，绑定的是布尔类型值。