vue

vue最简单的三段式布局

  • Post author:
  • Post category:vue

template>   <div class="wrapper">       <!-- 移动端三段式布局前置条件为在 app.vue或者index.html中给html和body,#app都加上height:100%，font-size:13.3333333vw ,然后在#app里加上font-size:16px -->       <header>&l…

继续阅读 vue最简单的三段式布局

vue.config.js配置打包删除console和debugger

  • Post author:
  • Post category:vue

项目版本： @vue/cli 4.5.15 webpack: 4.46.0 webpack-cli: 4.9.2 webpack-dev-server 3.11.3 vue.config.js配置 chainWebpack: (config) => { // 去掉debugger console config.when(process.env.NODE_ENV !== "developmen…

继续阅读 vue.config.js配置打包删除console和debugger

如何在Vue3+Vite中使用JSX

  • Post author:
  • Post category:vue

JSX介绍 JSX（JavaScript 和 XML），是一个 HTML-in-JavaScript 的语法扩展，首先在 React 中被进入。JSX 可以很好地描述 UI 应该呈现出它应有交互的本质形式。JSX 是在 JavaScript 语法上的拓展，因此类似于 HTML 的代码可以和 JS 共存。例如： const button = <MyButton color="blue" sha…

继续阅读 如何在Vue3+Vite中使用JSX

vue学习笔记（超详细）

  • Post author:
  • Post category:vue

文章目录 一. Vue基础认识Vue.jsVue安装方式Vue的MVVM 二. Vue基础语法生命周期模板语法创建Vue, options可以放什么语法综合v-onv-for遍历数组v-model表单绑定v-model结合radio类型使用v-model结合checkbox类型使用v-model结合select类型使用 值绑定修饰符检测数组更新 计算属性 computed计算属性setter和ge…

继续阅读 vue学习笔记（超详细）

vue3小野森森-02-readonly，watchEffect，watch，watch侦听多值，reactive与readonly周边，shallowReactive，shallowReadonly

  • Post author:
  • Post category:vue

1、readonly <template> <div> <span>{{}}</span> </div> </template> <script> import {reactive,readonly} from 'vue' export default { name: 'App', setup (props,con…

继续阅读 vue3小野森森-02-readonly，watchEffect，watch，watch侦听多值，reactive与readonly周边，shallowReactive，shallowReadonly

vue实现微信web开发之扫码签到

  • Post author:
  • Post category:vue

需要实现的业务需求 最近实现的业务需求上，要实现现场的实地签到，由于本身报名就是有小程序来实现的，又定好了扫码签到是有企业微信中接一个web应用来实现扫码。 利用vue-cli起一个web项目，写好页面，然后就是调微信扫一扫api。 根据微信官方文档实现调用扫码的api的配置 查询官方文档，发现接入api有四步操作 第一步：引入js文件 用的是vue/cli起的项目，直接是 cnpm i weix…

继续阅读 vue实现微信web开发之扫码签到

一个完整的vue.js例子，编辑表格

  • Post author:
  • Post category:vue

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href="styles/demo.css" /> </head> <body> <div id="a…

继续阅读 一个完整的vue.js例子，编辑表格

论如何用Vue实现一个弹窗-一个简单的组件实现

  • Post author:
  • Post category:vue

前言 最近在使用element-ui框架，用到了Dialog对话框组件，大致实现的效果，跟我之前自己在移动端项目里面弄的一个弹窗组件差不太多。然后就想着把这种弹窗组件的实现方式与大家分享一下，下面本文会带着大家手摸手实现一个弹窗组件。 本文主要内容会涉及到弹窗遮罩的实现，slot插槽的使用方式，props、$emit传参，具体组件代码也传上去了。如果喜欢的话可以点波赞/关注，支持一下，希望大家看完…

继续阅读 论如何用Vue实现一个弹窗-一个简单的组件实现

vue-cli + webpack 环境搭建

  • Post author:
  • Post category:vue

首先，我是一个新人新博客，写得不好，大家多提点，写这篇博客是为了自己熟悉vue-cli环境的搭建 1.下载nodeJS，官网 https://nodejs.org/en/ 。 2.安装nodeJS.安装完成后可以检测node -v 如果版本号的话则正常。 3.安装淘宝镜像.npm install -g cnpm --registry=https://registry.npm.taobao.org。…

继续阅读 vue-cli + webpack 环境搭建

Vue alias 配置路径别名，解决无法快捷跳转问题

  • Post author:
  • Post category:vue

配置路径别名，在项目vue.config.js文件中添加如下配置： const path = require('path') function resolve(dir) { return path.join(__dirname, dir) } module.exports = { configureWebpack: { resolve: { alias: { '@': resolve('src')…

继续阅读 Vue alias 配置路径别名，解决无法快捷跳转问题