VUE3.0

Vue.js 3.0 Composition APIs 及 3.0 原理剖析

Vue.js 3.0 介绍

一、Vue.js 源码组织方式

1. 源码采用TypeScript重写

提高了代码的可维护性。大型项目的开发都推荐使用类型化的语言，在编码的过程中检查类型的问题。

2. 使用Monorepo管理项目结构

使用一个项目管理多个包，把不同功能的代码放到不同的package中管理，每个功能模块都可以单独发布，单独测试，单独使用。

3. 不同构建版本

Vue3中不再构建UMD模块化的方式，因为UMD会让代码有更多的冗余，它要支持多种模块化的方式。Vue3中将CJS、ESModule和自执行函数的方式分别打包到了不同的文件中。在packages/vue中有Vue3的不同构建版本。

  • cjs（两个版本都是完整版，包含编译器）

    • vue.cjs.js
    • vue.cjs.prod.js（开发版，代码进行了压缩）

  • global（这四个版本都可以在浏览器中直接通过scripts标签导入，导入之后会增加一个全局的Vue对象）

    • vue.global.js（完整版，包含编译器和运行时）
    • vue.global.prod.js（完整版，包含编译器和运行时，这是开发版本，代码进行了压缩）
    • vue.runtime.global.js
    • vue.runtime.global.prod.js

  • browser（四个版本都包含esm，浏览器的原生模块化方式，可以直接通过

  • 支持模块的script默认延迟加载

  • 有了type="module"的模块是延迟加载的，类似于script标签设置defer

    • 在文档解析完成后，也就是DOM树生成之后，触发DOMContentLoaded事件前执行

2. Vite as Vue-CLI

  • Vite 在开发模式下不需要打包可以直接运行
  • Vue-CLI开发模式下必须对项目打包才可以运行

  • Vite在生产环境下使用Rollup打包

    • 基于ES Module的方式打包
  • Vue-CLI使用Webpack打包

3. Vite特点

  • 快速冷启动
  • 按需编译
  • 模块热更新

4. Vite创建项目

  • Vite创建项目

    npm init vite-app 
cd 
npm install
npm run dev

  • 基于模板创建项目

    npm init vite-app --template react
npm init vite-app --template preact

Compositon API

一、Composition API使用

1. 使用Vue3.0

先创建一个空文件夹，然后进入文件夹执行npm init -y，再执行npm install [email protected]安装vue3.0

创建index.html，vue3.0的使用


  

    x: {{ position.x }} 

    y: {{ position.y }}

2. setup、reactive的使用

  • createAPP：创建Vue对象
  • setup：CompositionAPI的入口
  • reactive：创建响应式对象

  

    x: {{ position.x }} 

    y: {{ position.y }}

二、 setup中的生命周期钩子函数

只需要在vue钩子函数首字母大写，并且钩子函数前面加上on，就可以了。特殊：原本的生命周期中的destroy对应的是onUnmounted。


  

    x: {{ position.x }} 

    y: {{ position.y }}

三、reactive-toRefs-ref

reactive创建的响应式数据解构后不再是响应式，toRefs可以把响应式对象的所有属性也转化成响应式的，所以可以解构toRefs返回的对象，解构之后还是响应式数据。

reactive是将普通对象转化成响应式对象，而ref是将基本类型数据包装成了响应式对象。

ref的使用：


  

    
    {{count}}

四、Computed

computed可以创建一个响应式数据，这个响应式数据依赖于其他响应式数据，就是计算属性。

  • 第一种用法

    • computed(() => count.value + 1)

  • 第二种用法

    const count = ref(1)
const plusOne = computed({
  get: () => count.value + 1,
  set: val => {
    count.value = val - 1
  }
})

使用：


  

    
    未完成：{{activeCount}}

五、watch

1. watch的三个参数

  • 第一个参数：要监听的数据，得是reactive或ref返回的对象
  • 第二个参数：监听到数据变化后执行的函数，这个函数有两个参数分别是新值和旧值
  • 第三个参数：选项对象，deep和immediate

2. watch的返回值

  • 取消监听的函数

使用：


  

    请选择一个yes/no的问题：
    
    
{{answer}}

六、WatchEffect

  • 是watch函数的简化版本，也用来监视数据的变化
  • 接受一个函数作为参数，监听函数内响应式数据的变化

  

    
    
    
{{count}}

六、实现todolist案例

1. ToDoList功能列表

  • 添加待办事项
  • 删除待办事项
  • 编辑待办事项
  • 切换待办事项
  • 存储待办事项

2. 项目结构

使用vue脚手架创建Vue项目，先升级vue-cli，4.5.6版本的vue-cli创建项目时可以选择vue版本。

Vue CLI 的包名称由 vue-cli 改成了 @vue/cli。 如果已经全局安装了旧版本的 vue-cli (1.x 或 2.x)，你需要先通过 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸载它

可以使用下列任一命令安装这个新的包：

npm install -g @vue/cli
# OR
yarn global add @vue/cli

先使用vue create创建项目，创建的时候选择3.0。

vue create 04-todolist

然后选择Default (Vue 3 Preview) ([Vue 3] babel, eslint)

就会自动创建项目了。

3. 添加待办事项

在输入框输入文本按下enter键提交待办事项

// 1. 添加待办事项
const useAdd = todos => {
  const input = ref('')
  const addTodo = () => {
    const text = input.value?.trim()
    if (text.length === 0) return
    todos.value.unshift({
      text,
      completed: false
    })
    input.value = ''
  }
  return {
    input,
    addTodo
  }
}

4. 删除待办事项

点击待办事项右侧的叉号可以删除待办事项

// 2. 删除待办事项
const useRemove = todos => {
  const remove = todo => {
    const index = todos.value.indexOf(todo)
    todos.value.splice(index, 1)
  }
  return {
    remove
  }
}

5. 编辑待办事项

双击进入编辑状态，按esc退出编辑，按enter提交编辑，如果删光了文本，则为删除这一项。

  • 双击待办事项，展示编辑文本框
  • 按回车或者编辑文本框失去焦点，修改数据
  • 按esc取消编辑
  • 把编辑文本框清空按回车，删除这一项
  • 显示编辑文本框的时候获取焦点
// 3. 编辑待办事项
const useEdit = (remove) => {
  let beforeEditingText = ''
  const editingTodo = ref(null)

  const editTodo = todo => {
    beforeEditingText = todo.text
    editingTodo.value = todo
  }
  const doneEdit = todo => {
    if (!editingTodo.value) return
    todo.text = todo.text.trim()
    if (todo.text === '') remove(todo)
    editingTodo.value = null
  }
  const cancelEdit = todo => {
    editingTodo.value = null
    todo.text = beforeEditingText
  }
  return {
    editingTodo,
    editTodo,
    doneEdit,
    cancelEdit
  }
}

模板中：

    
  
  • 
    
    
      
      
      
    
    
    
  
    •

6. 编辑文本框获取焦点 - vue3.0自定义指令

传对象形式：

  • Vue 2.x

    Vue.directive('editingFocus', {
  bind(el, binding, vnode, prevVnode) {},
  inserted() {},
  update() {} // remove,
  componentUpdated() {},
  unbind() {}
})

  • Vue 3.0

    app.directive('editingFocus', {
  beforeMount(el, binding, vnode, prevVnode) {},
  mounted() {},
  breforeUpdate() {}, // new
  updated() {},
  beforeUnmount() {}, // new
  unmounted() {}
})

传函数形式：

  • Vue 2.x

    Vue.directive('editingFocus', (el, binding) => {
  binding.value && el.focus()
})

  • Vue 3.0

    app.directive('editingFocus', (el, binding) => {
  binding.value && el.focus()
})

代码实现自定义事件获取正在编辑的文本框焦点：

export default {
  name: 'App',
  
  // 省略了setup() {},
  
  directives: {
    editingFocus: (el, binding) => { // binding可以获取到一些参数
      binding.value && el.focus()
    }
  }
}

使用：

. 切换待办事项

  • 点击CheckBox可以改变所有代办项状态
  • All/Active/Completed

  • 其他

    • 显示未完成代办项个数
    • 移除所有完成的项目
    • 如果没有待办项，隐藏main和footer
// 4. 切换待办项完成状态
const useFilter = todos => {
  const allDone = computed({
    get: () => {
      return !todos.value.filter(item => !item.completed).length
    },
    set: (value) => {
      todos.value.forEach(todo => {
        todo.completed = value
      })
    }
  })

  const filter = {
    all: list => list,
    active: list => list.filter(todo => !todo.completed),
    completed: list => list.filter(todo => todo.completed)
  }

  const type = ref('all')
  const filteredTodos = computed(() => filter[type.value](todos.value))

  const remainingCount = computed(() => filter.active(todos.value).length)

  const count = computed(() => todos.value.length)

  const onHashChange = () => {
    const hash = window.location.hash.replace('#/', '')
    if (filter[hash]) {
      type.value = hash
    } else {
      type.value = 'all'
      window.location.hash = ''
    }
  }

  onMounted(() => {
    window.addEventListener('hashchange', onHashChange)
    onHashChange()
  })

  onUnmounted(() => {
    window.removeEventListener('hashchange', onHashChange)
  })

  return {
    allDone,
    filteredTodos,
    remainingCount,
    count
  }
}

8. 本地存储

import useLocalStorage from './utils/useLocalStorage'
const storage = useLocalStorage()

// 5. 存储待办事项
const useStorage = () => {
  const KEY = 'TODOKEYS'
  const todos = ref(storage.getItem(KEY) || [])
  watchEffect(() => {
    storage.setItem(KEY, todos.value)
  })
  return todos
}

utils/useLocalStorage.js

function parse(str) {
  let value
  try {
    value = JSON.parse(str)
  } catch {
    value = null
  }
  return value
}

function stringify(obj) {
  let value
  try {
    value = JSON.stringify(obj)
  } catch {
    value = null
  }
  return value
}

export default function useLocalStorage() {
  function setItem(key, value) {
    value = stringify(value)
    window.localStorage.setItem(key, value)
  }
  function getItem(key) {
    let value = window.localStorage.getItem(key)
    if(value) {
      value = parse(value)
    }
    return value
  }
  return {
    setItem,
    getItem
  }
}

9. 完整代码

代码地址：https://gitee.com/jiailing/la...

image-20200919132619658

Vue.js 3.0响应式系统原理

一、介绍

1. Vue.js响应式回顾

  • Proxy对象实现属性监听
  • 多层属性嵌套，在访问属性过程中处理下一级属性
  • 默认监听动态添加的属性
  • 默认监听属性的删除操作
  • 默认监听数组索引和length属性
  • 可以作为单独的模块使用

2. 核心函数

  • eactive/ref/toRefs/computed
  • effect
  • track
  • trigger

二、Proxy对象回顾

1. 在严格模式下，Proxy的函数得返回布尔类型的值，否则会报TypeError

Uncaught TypeError: 'set' on proxy: trap returned falsish for property 'foo' 
'use strict'
// 问题1： set和deleteProperty中需要返回布尔类型的值
// 严格模式下，如果返回false的话，会出现TypeError的异常
const target = {
  foo: 'xxx',
  bar: 'yyy'
}
// Reflect.getPrototypeOf()
// Object.getPrototypeOf()
const proxy = new Proxy(target, {
  get (target, key, receiver) {
    // return target[key]
    return Reflect.get(target, key, receiver)
  },
  set (target, key, value, receiver) {
    // target[key] = value
    return Reflect.set(target, key, value, receiver) // 这里得写return
  },
  deleteProperty(target, key) {
    // delete target[key]
    return Reflect.deleteProperty(target, key) // 这里得写return
  }
})

proxy.foo = 'zzz'

2. Proxy和Reflect中使用receiver

Proxy中receiver：Proxy或者继承Proxy的对象
React中receiver：如果target对象设置了getter，getter中的this指向receiver

const obj = {
  get foo () {
    console.log(this)
    return this.bar
  }
}

const proxy = new Proxy(obj, {
  get(target, key, receiver) {
    if (key === 'bar') {
      return 'value - bar'
    }
    return Reflect.get(target, key, receiver) // 执行this.bar的时候，this指向代理对象，也就是获取target.bar
  }
})
console.log(proxy.foo) // value - bar

如果return Reflect.get(target, key, receiver)写成return Reflect.get(target, key)的话，则响应式属性foo里面的this还是指向原本的对象obj，this.bar就是undefined，而传入了receiver之后，响应式属性里的this就指向新的响应式对象proxy，this.bar返回value - bar。

三、reactive

  • 接受一个参数，判断这个参数是否是对象
  • 创建拦截器对象handler，设置get/set/deleteProperty
  • 返回Proxy对象

自己实现reactive

function isObject(value) {
  return value !== null && typeof value === 'object'
}

function convert(target) {
  return isObject(target) ? reactive(target) : target
}

const hasOwnProperty = Object.prototype.hasOwnProperty

function hasOwn(target, key) {
  return hasOwnProperty.call(target, key)
}

export function reactive(target) {
  if (!isObject(target)) return target

  const handler = {
    get (target, key, receiver) {
      // 收集依赖
      // track(target, key) // 稍后解注释
      console.log('get', key)
      const ret = Reflect.get(target, key, receiver)
      return convert(ret)
    },
    set (target, key, value, receiver) {
      const oldValue = Reflect.get(target, key, receiver)
      let ret = true
      if (oldValue !== value) {
        ret = Reflect.set(target, key, value, receiver)
        // 触发更新
        // trigger(target, key) // 稍后解注释
                console.log('set', key, value)
      }
      return ret
    },
    deleteProperty (target, key) {
      const hasKey = hasOwn(target, key)
      const ret = Reflect.deleteProperty(target, key)
      if (hasKey && ret) {
        // 触发更新
        // trigger(target, key) // 稍后解注释
                console.log('detele', key)
      }
      return ret
    }
  }

  return new Proxy(target, handler)
}

使用：

输出结果为：

set name lisi
index.js:39 detele age
index.html:17 Proxy {name: "lisi"}

四、收集依赖

image-20200916221300033

五、effect、track

let activeEffect = null
export function effect(callback) {
  activeEffect = callback
  callback() // 访问响应式对象的属性，去收集依赖
  activeEffect = null
}

let targetMap = new WeakMap()
export function track(target, key) { // 收集依赖
  if (!activeEffect)return
  let depsMap = targetMap.get(target)
  if(!depsMap) {
    targetMap.set(target, depsMap = new Map())
  }
  let dep = depsMap.get(key)
  if(!dep) {
    depsMap.set(key, dep = new Set())
  }
  dep.add(activeEffect)
}

六、trigger

export function trigger(target, key) { // 触发依赖
  const depsMap = targetMap.get(target)
  if(!depsMap)return
  const dept = depsMap.get(key)
  if(dept) {
    dept.forEach(effect => {
      effect()
    })
  }
}

使用：

七、ref

eactive vs ref

  • ref可以把基本数据类型数据转换成响应式对象
  • ref返回的对象，重新赋值成对象也是响应式的
  • reactive返回的对象，重新赋值丢失响应式
  • reactive返回的对象不可解构

  • reactive

    const product = reactive({
  name: 'iPhone',
  price: 5000,
  count: 3
})

  • ref

    const price = ref(5000)
const count = ref(3)

实现ref：

export function ref(raw) {
  // 判断raw是否是ref创建的对象，如果是的话直接返回
  if (isObject(raw) && raw.__v_isRef)return

  let value = convert(raw)
  const r = {
    __v_isRef: true,
    get value () {
      track(r, 'value')
      return value
    },
    set value (newValue) {
      if(newValue !== value) {
        raw = newValue
        value = convert(raw)
        trigger(r, 'value')
      }
    }
  }
  return r
}

使用：

八、toRefs

export function toRefs(proxy) {
  const ret = proxy instanceof Array ? new Array(proxy.length) : {}
  for (const key in proxy) {
    ret[key] = toProxyRef(proxy, key)
  }
  return ret
}

function toProxyRef(proxy, key) {
  const r = {
    __v_isRef: true,
    get value () {
      return proxy[key]
    },
    set value (newValue) {
      proxy[key] = newValue
    }
  }
  return r
}

使用

九、computed

export function computed(getter) {
  const result = ref()
  effect(() => (result.value = getter()))
  return result
}

使用
备注：trigger/track/effct是低层的函数，一般不用。使用computed代替effect的使用

Vite实现原理

一、Vite介绍

1. Vite概念：

  • Vite是一个面向现代浏览器的一个更轻更快的web应用开发工具
  • 它基于ECMAScript标准原生模块系统（ES Modules）实现

2. Vite项目依赖：

  • Vite
  • @vue/compiler-sfc

3. 基础使用：

vite serve / vite build

image-20200919134939905

在运行vite serve的时候不需要打包，直接开启一个web服务器，当浏览器请求服务器，比如请求一个单文件组件，这个时候在服务器端编译单文件组件，然后把编译的结果返回给浏览器，注意这里的编译是在服务器端，另外模块的处理是在请求到服务器端处理的。

而vue-cli-service serve：

image-20200919135311658

当运行vue-cli-service serve的时候，它内部会使用webpack，首先去打包所有的模块，如果模块数量比较多的话，打包速度会非常的慢，把打包的结果存储到内存中，然后才会开启开发的web服务器，浏览器请求web服务器，把内存中打包的结果直接返回给浏览器，像webpack这种工具，它的做法是将所有的模块提前编译打包进bundle里，也就是不管模块是否被执行，是否使用到，都要被编译和打包到bundle。随着项目越来越大，打包后的bundle也越来越大，打包的速度自然也就越来越慢。

Vite利用现代浏览器原生支持的ESModule这个模块化的特性省略了对模块的打包，对于需要编译的文件，比如单文件组件、样式模块等，vite采用的另一种模式即时编译，也就是说只有具体去请求某个文件的时候，才会在服务端编译这个文件，所以这种即时编译的好处主要体现在按需编译，速度会更快。

4. HMR:

  • Vite HMR

    • 立即变异当前所修改的文件

  • Webpack HMR

    • 会自动以这个文件位入口重新build一次，所有的涉及到的依赖也会被重新加载一次，所以反应速度会慢一些

5. Build：

  • Vite build

    • Rollup

    • Dynamic import

      • polyfill

6. 打包OR不打包：

  • 使用Webpack打包的两个原因：

    • 浏览器环境并不支持模块化（而现在大部分浏览器都支持ESM模块化了）
    • 零散的模块文件会产生大量的HTTP请求（HTTP2可以长连接）

7. 浏览器对ESModule的支持：

8. 开箱即用：

  • TypeScript - 内置支持
  • less/sass/stylus/postcss - 内置支持（需要单独安装）
  • JSX
  • Web Assembly

9. Vite特性

  • 快速冷启动
  • 模块热更新
  • 按需编译
  • 开箱即用

二、静态Web服务器

1. Vite核心功能

  • 静态web服务器
  • 编译单文件组件：拦截浏览器不识别的模块，并处理
  • HMR

三、修改第三方模块的路径

创建两个中间件，一个中间件是把加载第三方模块中的import中的路径改变，改成加载@modules/模块文件名，另一个中间件是当请求过来之后，判断请求路径中是否有@modules/模块名称，如果有的话，去node_modules加载对应的模块

四、加载第三方模块

当请求过来之后，判断请求路径中是否以@modules开头，如果是的话，去node_modules加载对应的模块

五、编译单文件组件

发送两次请求，第一次请求是把单文件组件编译成一个对象，第二次请求是编译单文件组件的模板，返回一个render函数，并且把render函数挂载到对象的render方法上。

最终代码

#!/usr/bin/env node
const path = require('path')
const {Readable} = require('stream')
const Koa = require('koa')
const send = require('koa-send')
const compilerSFC = require('@vue/compiler-sfc')

const app = new Koa()

// 将流转化成字符串
const streamToString = stream => new Promise((resolve, reject) => {
  const chunks = []
  stream.on('data', chunk => chunks.push(chunk))
  stream.on('end', () => resolve(Buffer.concat(chunks).toString('utf-8')))
  stream.on('error', reject)
})

// 将字符串转化成流
const stringToStream = text => {
  const stream = new Readable()
  stream.push(text)
  stream.push(null)
  return stream
}

// 3. 加载第三方模块。判断请求路径中是否以`@modules`开头，如果是的话，去node_modules加载对应的模块
app.use(async (ctx, next) => {
  // ctx.path --> /@modules/vue
  if (ctx.path.startsWith('/@modules/')) {
    const moduleName = ctx.path.substr(10)
    const pkgPath = path.join(process.cwd(), 'node_modules', moduleName, 'package.json')
    const pkg = require(pkgPath)
    ctx.path = path.join('/node_modules', moduleName, pkg.module)
  }
  await next()
})

// 1. 开启静态文件服务器
app.use(async (ctx, next) => {
  await send(ctx, ctx.path, {
    root: process.cwd(),
    index: 'index.html'
  })
  await next()
})

// 4. 处理单文件组件
app.use(async (ctx, next) => {
  if(ctx.path.endsWith('.vue')) {
    const contents = await streamToString(ctx.body)
    const { descriptor } = compilerSFC.parse(contents) // 返回一个对象，成员descriptor、errors
    let code
    if (!ctx.query.type) { // 第一次请求，把单文件组件编译成一个对象
      code = descriptor.script.content
      // console.log('code', code)
      code = code.replace(/export\s+default\s+/g, 'const __script = ')
      code += `
import { render as __render } from "${ctx.path}?type=template"
__script.render = __render
export default __script
      `
    } else if (ctx.query.type === 'template') {
      const templateRender = compilerSFC.compileTemplate({ source: descriptor.template.content })
      code = templateRender.code
    }
    ctx.type = 'application/javascript'
    ctx.body = stringToStream(code) // 转化成流
  }
  await next()
})

// 2. 修改第三方模块的路径
app.use(async (ctx, next) => {
  if (ctx.type === 'application/javascript') {
    const contents = await streamToString(ctx.body)
    // import vue from 'vue'
    // import App from './App.vue'
    ctx.body = contents
    .replace(/(from\s+['"])(?![\.\/])/g, '$1/@modules/') // 分组匹配，第一个分组中，from原样匹配form，\s+匹配一至多个空格，['"]匹配单引号或双引号。第二个分组中，?!标识不匹配这个分组的结果,也就是排除点开头或者\开头的情况
    .replace(/process\.env\.NODE_ENV/g, '"development"')// 替换process对象
  }
})


app.listen(4000)
console.log('Server running @ http://localhost:4000')

使用时先将cli项目link到全局，npm link

然后在vue3项目中执行my-vite-cli运行项目。vue3中的图片和样式模块导入代码注释掉了。

image-20200919070922850

你可能感兴趣的:(vue.js)

  • Vue：为什么要使用v-cloak 刻刻帝的海角 vue.js前端javascript
    Vue.js是一种流行的JavaScript框架，它使我们能够构建交互性强大的用户界面。在Vue.js中，v-cloak是一个指令，用于解决在页面加载时出现的闪烁问题。本文将介绍如何使用v-cloak及代码来优化Vue.js应用程序的渲染效果。引言当我们使用Vue.js构建应用程序时，有时会遇到一个问题：在页面加载时，由于Vue.js需要一定的时间来解析和渲染模板，会导致页面上显示出未经处理的Mu
  • 如何快速上手Vue框架? 山间漫步人生路 vue.js前端框架vue.js
    要快速上手Vue框架，可以按照以下步骤进行：一、准备工作了解Vue：Vue是一个构建用户界面的渐进式框架，核心库只关注视图层。环境准备：安装Node.js和npm，这是Vue开发的基础环境。二、安装Vue全局安装VueCLI：使用npm全局安装VueCLI，它是一个基于Vue.js进行快速开发的完整系统。npminstall-g@vue/cli三、创建Vue项目使用VueCLI创建新项目：vuec
  • [套路] 浏览器引入Vue.js场景-WangEditor富文本编辑器的使用 (永久免费) Grandpa_Rick 套路frontendvue.js前端javascriptwangEditor
    系列文章目录[套路]el-table多选属性实现单选效果[套路]基于服务内存实现的中文拼音混合查询[套路]Bypass滑块验证码目录系列文章目录前言一、实现1.1场景1.2Window对象简介1.3引入WangEditor1.4页面配置前言公司使用freemarker的老旧SpringBootWeb后台项目,前两年通过浏览器引入js的方式使用Vue简单升级了下,方便迭代功能.近期一个很简单的功能需
  • python社区垃圾分类管理平台的设计与实现flask-django-php-nodejs QQ_511008285 pythonflaskdjangovue.jsphpnode.js
    近些年来，随着科技的飞速发展，互联网的普及逐渐延伸到各行各业中，给人们生活带来了十分的便利，社区垃圾分类管理平台利用计算机网络实现信息化管理，使整个社区垃圾分类管理的发展和服务水平有显著提升。语言：Python框架：django/flask软件版本：python3.7.7数据库：mysql数据库工具：Navicat前端框架:vue.js通过比较两个不同因素的框架，可以看出Flask和Django不
  • Vue生命周期 长沙火山 iOS开发vue.js前端javascript
    一、生命周期在Vue.js中，组件实例有一个完整的生命周期，包括创建、挂载、更新和销毁等阶段。Vue生命周期钩子函数允许我们在组件不同阶段添加自定义逻辑。以下是Vue生命周期的详细介绍：1.1创建阶段（Creation）beforeCreate在实例初始化之后，数据观测(dataobserver)和事件配置(event/watchersetup)之前被调用。此时实例还未初始化完成，数据和方法均不可
  • Python招聘信息爬虫数据可视化分析大屏全屏系统(Django框架) 开题报告 黄菊华老师 毕设资料python开发语言
    博主介绍：黄菊华老师《Vue.js入门与商城开发实战》《微信小程序商城开发》图书作者，CSDN博客专家，在线教育专家，CSDN钻石讲师；专注大学生毕业设计教育和辅导。所有项目都配有从入门到精通的基础知识视频课程，学习后应对毕业设计答辩。项目配有对应开发文档、开题报告、任务书、PPT、论文模版等项目都录了发布和功能操作演示视频；项目的界面和功能都可以定制，包安装运行！！！如果需要联系我，可以在CSD
  • 如何清除keep-alive缓存 泡芙·草莓 缓存
    在Vue.js中，使用组件可以将组件保留在内存中，以避免重复渲染和销毁，从而提高性能。如果需要手动清除组件的缓存，可以通过两种方法来实现：通过$destroy方法销毁组件：可以在组件内部手动调用$destroy方法来销毁组件实例，从而清除缓存。这样在下次需要再次渲染时，组件会重新创建。this.$destroy();通过设置include和exclude属性：可以通过设置组件的include和ex
  • vuex怎么防止数据刷新丢失？ 一个大长腿 javascript开发语言ecmascript
    在Vue.js应用程序中，Vuex是一个用于管理应用程序状态的状态管理库。默认情况下，Vuex的状态存储在内存中，并且在页面刷新时会丢失。为了防止数据刷新丢失，你可以考虑以下几种方法：这些方法可以帮助你防止Vuex数据刷新丢失。根据你的应用场景和需求，选择最适合你的方法即可。使用持久化插件：Vuex提供了一些第三方插件，如vuex-persistedstate，可以将状态持久化到本地存储（如loc
  • Vue项目中使用Mock.js进行API模拟 洛可可白 前端专栏javascriptvue.js前端
    Vue项目中使用Mock.js进行API模拟前言欢迎来到我的小天地，这里是我记录技术点滴、分享学习心得的地方。️技能清单编程语言：Java、C、C++、Python、Go、前端技术：Jquery、Vue.js、React、uni-app、EchartsUI设计:Element-ui、Antd、Color-ui后端技术：SpringBoot、Mybatis-plus、Swagger移动开发：Andr
  • Python贵州贵阳二手房源爬虫数据可视化分析大屏全屏系统 开题报告 黄菊华老师 毕设资料贵州贵阳二手房源爬虫数据可视化
    博主介绍：黄菊华老师《Vue.js入门与商城开发实战》《微信小程序商城开发》图书作者，CSDN博客专家，在线教育专家，CSDN钻石讲师；专注大学生毕业设计教育和辅导。所有项目都配有从入门到精通的基础知识视频课程，学习后应对毕业设计答辩。项目配有对应开发文档、开题报告、任务书、PPT、论文模版等项目都录了发布和功能操作演示视频；项目的界面和功能都可以定制，包安装运行！！！如果需要联系我，可以在CSD
  • 基于Python电影院在线选座订票系统 (Django框架)答辩常规问题和如何回答(答辩指导) 黄菊华老师 毕设资料电影院在线选座订票系统
    博主介绍：黄菊华老师《Vue.js入门与商城开发实战》《微信小程序商城开发》图书作者，CSDN博客专家，在线教育专家，CSDN钻石讲师；专注大学生毕业设计教育和辅导。所有项目都配有从入门到精通的基础知识视频课程，学习后应对毕业设计答辩。项目配有对应开发文档、开题报告、任务书、PPT、论文模版等项目都录了发布和功能操作演示视频；项目的界面和功能都可以定制，包安装运行！！！如果需要联系我，可以在CSD
  • Python北京二手房源爬虫数据可视化分析大屏全屏系统 开题报告 黄菊华老师 毕设资料北京二手房源爬虫数据可视化
    博主介绍：黄菊华老师《Vue.js入门与商城开发实战》《微信小程序商城开发》图书作者，CSDN博客专家，在线教育专家，CSDN钻石讲师；专注大学生毕业设计教育和辅导。所有项目都配有从入门到精通的基础知识视频课程，学习后应对毕业设计答辩。项目配有对应开发文档、开题报告、任务书、PPT、论文模版等项目都录了发布和功能操作演示视频；项目的界面和功能都可以定制，包安装运行！！！如果需要联系我，可以在CSD
  • Python湖南长沙二手房源爬虫数据可视化分析大屏全屏系统 开题报告 黄菊华老师 毕设资料湖南长沙二手房源爬虫数据可视化
    博主介绍：黄菊华老师《Vue.js入门与商城开发实战》《微信小程序商城开发》图书作者，CSDN博客专家，在线教育专家，CSDN钻石讲师；专注大学生毕业设计教育和辅导。所有项目都配有从入门到精通的基础知识视频课程，学习后应对毕业设计答辩。项目配有对应开发文档、开题报告、任务书、PPT、论文模版等项目都录了发布和功能操作演示视频；项目的界面和功能都可以定制，包安装运行！！！如果需要联系我，可以在CSD
  • 【vue.js】文档解读【day 1】 | 模板语法2 欲尽 vuevue.js前端javascript
    如果阅读有疑问的话，欢迎评论或私信！！本人会很热心的阐述自己的想法！谢谢！！！文章目录模板语法JavaScript表达式仅支持表达式调用函数？受限的全局访问指令参数动态参数动态参数中值的限制动态参数中语法的限制模板语法JavaScript表达式除了前面的文本插值、绑定attr属性外，我们还可以直接在Vue中输入JavaScript表达式。就像下面这样：{{message.split('').rev
  • 【python课程作业】python学生成绩管理系统 山东好汉Tim python开发语言
    功能介绍平台采用B/S结构，后端采用主流的Python语言进行开发，前端采用主流的Vue.js进行开发。给舍友做的课程作业。功能包括：成绩管理、学生管理、课程管理、班级管理、用户管理、日志管理、系统信息模块。源码地址https://github.com/geeeeeeeek/python_score演示地址http://score.gitapp.cn/?rel=1演示帐号：用户名：admin123
  • Vue3教程 m0_59519985 Vuevue
    1.1配置环境vue官网：Vue.js-TheProgressiveJavaScriptFramework|Vue.js终端Linux和Mac上可以用自带的终端。Windows上推荐用powershell或者cmd。GitBash有些指令不兼容。安装Nodejs安装地址：Node.js安装@vue/cli打开GitBash，执行：npmi-g@vue/cli如果执行后面的操作有bug，可能是最新版
  • Vue.js--基础 Lemon_Kang
    Vue1、基本概念渐进式框架 渐进式意味着你可以将Vue作为你应用的一部分嵌入其中，带来更丰富的交互体验特点解耦视图和数据可复用的组件前端路由技术状态管理虚拟DOM2、安装Vue.js 1.直接CDN引入 2.下载后项目中引入js文件 3.使用npm安装3、初体验{{message}}{{item}}{{count}}+-//数据和视图分离引入vue的js文件//let(ES6定义变量)/cons
  • Vue路由模式 几何心凉 前端小常识vue.js前端javascript
    聚沙成塔·每天进步一点点本文内容⭐专栏简介路由模式1.Hash模式2.History模式选择路由模式的考虑因素⭐写在最后⭐专栏简介Vue学习之旅的奇妙世界欢迎大家来到Vue技能树参考资料专栏！创建这个专栏的初衷是为了帮助大家更好地应对Vue.js技能树的学习。每篇文章都致力于提供清晰、深入的参考资料，让你能够更轻松、更自信地理解和掌握Vue.js的核心概念和技术。订阅这个专栏，让我们一同踏上更深入
  • Python上海美食餐厅餐馆商家爬虫数据可视化分析和推荐查询系统 开题报告 黄菊华老师 毕设资料上海美食餐厅餐馆爬虫数据可视化
    博主介绍：黄菊华老师《Vue.js入门与商城开发实战》《微信小程序商城开发》图书作者，CSDN博客专家，在线教育专家，CSDN钻石讲师；专注大学生毕业设计教育和辅导。所有项目都配有从入门到精通的基础知识视频课程，学习后应对毕业设计答辩。项目配有对应开发文档、开题报告、任务书、PPT、论文模版等项目都录了发布和功能操作演示视频；项目的界面和功能都可以定制，包安装运行！！！如果需要联系我，可以在CSD
  • Vue 3 中的 Composition API 详解 奔强的程序 vue
    Vue.js，作为前端领域流行的框架之一，以其响应式数据绑定和组件化开发赢得了广大开发者的喜爱。随着前端技术的不断发展和项目复杂度的增加，Vue团队推出了Vue3，并引入了CompositionAPI，以更好地满足复杂应用的需求。一、CompositionAPI是什么？CompositionAPI是Vue3中新增的一组API，它允许开发者使用函数式编程的方式来组织和复用组件逻辑。与Vue2中的Op
  • Vue 3.4 - 详细发布说明 大鱼前端 前端
    欢迎关注微信公众号：前端历险记Vue.js，作为一个流行的前端框架，以其响应式数据绑定和灵活的组件系统而闻名。Vue3是Vue.js的一个主要版本，它引入了许多新的特性和改进，包括CompositionAPI、性能优化和更小的体积。现在，随着Vue3.4的发布，这个框架又向前迈进了一大步。一、性能提升渲染优化：Vue3.4对其渲染引擎进行了进一步的优化，特别是在处理大量动态节点和复杂组件树时。通过
  • Python青海西宁二手房源爬虫数据可视化分析大屏全屏系统 开题报告 黄菊华老师 毕设资料青海西宁二手房源爬虫数据可视化
    博主介绍：黄菊华老师《Vue.js入门与商城开发实战》《微信小程序商城开发》图书作者，CSDN博客专家，在线教育专家，CSDN钻石讲师；专注大学生毕业设计教育和辅导。所有项目都配有从入门到精通的基础知识视频课程，学习后应对毕业设计答辩。项目配有对应开发文档、开题报告、任务书、PPT、论文模版等项目都录了发布和功能操作演示视频；项目的界面和功能都可以定制，包安装运行！！！如果需要联系我，可以在CSD
  • Vue 3.4 - 详细发布说明 前端
    欢迎关注微信公众号：前端历险记Vue.js，作为一个流行的前端框架，以其响应式数据绑定和灵活的组件系统而闻名。Vue3是Vue.js的一个主要版本，它引入了许多新的特性和改进，包括CompositionAPI、性能优化和更小的体积。现在，随着Vue3.4的发布，这个框架又向前迈进了一大步。一、性能提升渲染优化：Vue3.4对其渲染引擎进行了进一步的优化，特别是在处理大量动态节点和复杂组件树时。通过
  • 前端工程化面试题 | 15.精选前端工程化高频面试题 ai_todo 前端工程化前端javascripttypescript开发语言
    前端开发工程师、技术日更博主、已过CET6阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1牛客高级专题作者、打造专栏《前端面试必备》、《2024面试高频手撕题》蓝桥云课签约作者、上架课程《Vue.js和Egg.js开发企业级健康管理项目》、《带你从入门到实战全面掌握uni-app》文章目录请解释一下前端中的代码分支管理和代码合并。你熟悉的代码合并工具有哪些？解释一下前端中的流程管理
  • vue实现商品评分效果（通过插件实现） 小刘的博客间 vue.jsjavascript前端htmlcss
    Vue.js实现了一个简单的商品评分功能。用户可以通过点击星星来修改商品的评分，并且评分显示了相应的星星数。废话不多说，直接上代码方法一：exportdefault{data(){return{formData:{status_id:0,//初始评分为0},};},};方法二：商品评分:{{status_id}}★exportdefault{data(){return{status_i
  • Python辽宁沈阳二手房源爬虫数据可视化分析大屏全屏系统 开题报告 黄菊华老师 毕设资料辽宁沈阳二手房源爬虫数据可视化
    博主介绍：黄菊华老师《Vue.js入门与商城开发实战》《微信小程序商城开发》图书作者，CSDN博客专家，在线教育专家，CSDN钻石讲师；专注大学生毕业设计教育和辅导。所有项目都配有从入门到精通的基础知识视频课程，学习后应对毕业设计答辩。项目配有对应开发文档、开题报告、任务书、PPT、论文模版等项目都录了发布和功能操作演示视频；项目的界面和功能都可以定制，包安装运行！！！如果需要联系我，可以在CSD
  • 如何快速上手Vue框架 程序老猫 vue.js
    快速上手Vue.js框架，你可以遵循以下步骤：###**环境准备**1.**安装Node.js**：确保你的开发环境中已安装了最新版的Node.js，因为VueCLI（Vue的命令行工具）需要Node.js环境。2.**全局安装VueCLI**：打开终端或命令提示符，运行以下命令来全局安装VueCLI：```bashnpminstall-g@vue/cli```3.**创建新项目**：使用VueC
  • vue.js的介绍 Komorebi_9999 vue.js前端javascript
    Vue.js（通常简称为Vue）是一个构建用户界面的渐进式框架。Vue被设计为自底向上逐层应用，其核心库只关注视图层，易于与其他库或已有项目整合。Vue的目标是通过尽可能简单的API实现响应的数据绑定和组合的视图组件。Vue.js和Vue实际上是指同一个东西，Vue.js是Vue的全称。当人们在讨论Vue时，他们通常指的是Vue.js这个框架。Vue.js提供了一种声明式渲染的语法，可以非常方便地
  • uni-pp(一)什么是uni-pp AlanGe
    uni-app是一个使用Vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台。DCloud公司拥有900万开发者、数百万应用、12亿手机端月活用户、数千款uni-app插件、70+微信/qq群。阿里小程序工具官方内置uni-app），腾讯课堂官方为uni-
  • vue.js之视频播放器组件 一个小前端程序员
    首先，安装依赖npminstallvue-video-player-S然后，在src/main.js中importVueVideoPlayerfrom'vue-video-player'import'video.js/dist/video-js.css'Vue.use(VueVideoPlayer)最后，在组件中使用exportdefault{data(){return{playerOptions
  • JVM StackMapTable 属性的作用及理解 lijingyao8206 jvm字节码Class文件StackMapTable
            在Java 6版本之后JVM引入了栈图(Stack Map Table)概念。为了提高验证过程的效率，在字节码规范中添加了Stack Map Table属性，以下简称栈图，其方法的code属性中存储了局部变量和操作数的类型验证以及字节码的偏移量。也就是一个method需要且仅对应一个Stack Map Table。在Java 7版
  • 回调函数调用方法 百合不是茶 java
    最近在看大神写的代码时,.发现其中使用了很多的回调 ,以前只是在学习的时候经常用到 ,现在写个笔记 记录一下   代码很简单:           MainDemo  :调用方法  得到方法的返回结果        
  • [时间机器]制造时间机器需要一些材料 comsci 制造
          根据我的计算和推测,要完全实现制造一台时间机器,需要某些我们这个世界不存在的物质     和材料...       甚至可以这样说,这种材料和物质,我们在反应堆中也无法获得......      
  • 开口埋怨不如闭口做事 邓集海 邓集海 做人 做事 工作
    “开口埋怨，不如闭口做事。”不是名人名言，而是一个普通父亲对儿子的训导。但是，因为这句训导，这位普通父亲却造就了一个名人儿子。这位普通父亲造就的名人儿子，叫张明正。 　　 　　张明正出身贫寒，读书时成绩差，常挨老师批评。高中毕业，张明正连普通大学的分数线都没上。高考成绩出来后，平时开口怨这怨那的张明正，不从自身找原因，而是不停地埋怨自己家庭条件不好、埋怨父母没有给他创造良好的学习环境。 　　 　　
  • jQuery插件开发全解析，类级别与对象级别开发 IT独行者 jquery开发插件　函数
    jQuery插件的开发包括两种： 一种是类级别的插件开发，即给 jQuery添加新的全局函数，相当于给 jQuery类本身添加方法。 jQuery的全局函数就是属于 jQuery命名空间的函数，另一种是对象级别的插件开发，即给 jQuery对象添加方法。下面就两种函数的开发做详细的说明。   1 、类级别的插件开发 类级别的插件开发最直接的理解就是给jQuer
  • Rome解析Rss 413277409 Rome解析Rss
    import java.net.URL;  import java.util.List;    import org.junit.Test;    import com.sun.syndication.feed.synd.SyndCategory;  import com.sun.syndication.feed.synd.S
  • RSA加密解密 无量 加密解密rsa
    RSA加密解密代码 代码有待整理 package com.tongbanjie.commons.util; import java.security.Key; import java.security.KeyFactory; import java.security.KeyPair; import java.security.KeyPairGenerat
  • linux 软件安装遇到的问题 aichenglong linux遇到的问题ftp
    1 ftp配置中遇到的问题    500 OOPS: cannot change directory   出现该问题的原因:是SELinux安装机制的问题.只要disable SELinux就可以了   修改方法:1 修改/etc/selinux/config 中SELINUX=disabled    2 source /etc
  • 面试心得 alafqq 面试
    最近面试了好几家公司。记录下； 支付宝，面试我的人胖胖的，看着人挺好的；博彦外包的职位，面试失败； 阿里金融，面试官人也挺和善，只不过我让他吐血了。。。 由于印象比较深，记录下； 1，自我介绍 2，说下八种基本类型；（算上string。楼主才答了3种，哈哈，string其实不是基本类型，是引用类型） 3，什么是包装类，包装类的优点； 4，平时看过什么书？NND，什么书都没看过。。照样
  • java的多态性探讨 百合不是茶 java
    java的多态性是指main方法在调用属性的时候类可以对这一属性做出反应的情况 //package 1; class A{ public void test(){ System.out.println("A"); } } class D extends A{ public void test(){ S
  • 网络编程基础篇之JavaScript-学习笔记 bijian1013 JavaScript
    1.documentWrite <html> <head> <script language="JavaScript"> document.write("这是电脑网络学校"); document.close(); </script> </h
  • 探索JUnit4扩展：深入Rule bijian1013 JUnitRule单元测试
            本文将进一步探究Rule的应用，展示如何使用Rule来替代@BeforeClass，@AfterClass，@Before和@After的功能。         在上一篇中提到，可以使用Rule替代现有的大部分Runner扩展，而且也不提倡对Runner中的withBefores()，withAfte
  • [CSS]CSS浮动十五条规则 bit1129 css
    这些浮动规则，主要是参考CSS权威指南关于浮动规则的总结，然后添加一些简单的例子以验证和理解这些规则。   1. 所有的页面元素都可以浮动 2. 一个元素浮动后，会成为块级元素，比如<span>,a, strong等都会变成块级元素 3.一个元素左浮动，会向最近的块级父元素的左上角移动，直到浮动元素的左外边界碰到块级父元素的左内边界；如果这个块级父元素已经有浮动元素停靠了
  • 【Kafka六】Kafka Producer和Consumer多Broker、多Partition场景 bit1129 partition
    0.Kafka服务器配置 3个broker 1个topic，6个partition，副本因子是2 2个consumer，每个consumer三个线程并发读取   1. Producer package kafka.examples.multibrokers.producers; import java.util.Properties; import java.util.
  • zabbix_agentd.conf配置文件详解 ronin47 zabbix 配置文件
    Aliaskey的别名，例如 Alias=ttlsa.userid:vfs.file.regexp[/etc/passwd,^ttlsa:.:([0-9]+),,,,\1]， 或者ttlsa的用户ID。你可以使用key：vfs.file.regexp[/etc/passwd,^ttlsa:.: ([0-9]+),,,,\1]，也可以使用ttlsa.userid。备注: 别名不能重复，但是可以有多个
  • java--19.用矩阵求Fibonacci数列的第N项 bylijinnan fibonacci
    参考了网上的思路，写了个Java版的： public class Fibonacci { final static int[] A={1,1,1,0}; public static void main(String[] args) { int n=7; for(int i=0;i<=n;i++){ int f=fibonac
  • Netty源码学习-LengthFieldBasedFrameDecoder bylijinnan javanetty
    先看看LengthFieldBasedFrameDecoder的官方API http://docs.jboss.org/netty/3.1/api/org/jboss/netty/handler/codec/frame/LengthFieldBasedFrameDecoder.html API举例说明了LengthFieldBasedFrameDecoder的解析机制，如下： 实
  • AES加密解密 chicony 加密解密
    AES加解密算法，使用Base64做转码以及辅助加密： package com.wintv.common; import javax.crypto.Cipher; import javax.crypto.spec.IvParameterSpec; import javax.crypto.spec.SecretKeySpec; import sun.misc.BASE64Decod
  • 文件编码格式转换 ctrain 编码格式
    package com.test; import java.io.File; import java.io.FileInputStream; import java.io.FileOutputStream; import java.io.IOException; import java.io.InputStream; import java.io.OutputStream;
  • mysql 在linux客户端插入数据中文乱码 daizj mysql中文乱码
    1、查看系统客户端，数据库，连接层的编码  查看方法： http://daizj.iteye.com/blog/2174993 进入mysql，通过如下命令查看数据库编码方式： mysql>  show variables like 'character_set_%'; +--------------------------+------
  • 好代码是廉价的代码 dcj3sjt126com 程序员读书
      长久以来我一直主张：好代码是廉价的代码。 当我跟做开发的同事说出这话时，他们的第一反应是一种惊愕，然后是将近一个星期的嘲笑，把它当作一个笑话来讲。 当他们走近看我的表情、知道我是认真的时，才收敛一点。 当最初的惊愕消退后，他们会用一些这样的话来反驳： “好代码不廉价，好代码是采用经过数十年计算机科学研究和积累得出的最佳实践设计模式和方法论建立起来的精心制作的程序代码。” 我只
  • Android网络请求库——android-async-http dcj3sjt126com android
    在iOS开发中有大名鼎鼎的ASIHttpRequest库，用来处理网络请求操作，今天要介绍的是一个在Android上同样强大的网络请求库android-async-http，目前非常火的应用Instagram和Pinterest的Android版就是用的这个网络请求库。这个网络请求库是基于Apache HttpClient库之上的一个异步网络请求处理库，网络处理均基于Android的非UI线程，通
  • ORACLE 复习笔记之SQL语句的优化 eksliang SQL优化Oracle sql语句优化SQL语句的优化
    转载请出自出处：http://eksliang.iteye.com/blog/2097999   SQL语句的优化总结如下   sql语句的优化可以按照如下六个步骤进行： 合理使用索引 避免或者简化排序 消除对大表的扫描 避免复杂的通配符匹配 调整子查询的性能 EXISTS和IN运算符 下面我就按照上面这六个步骤分别进行总结：
  • 浅析：Android 嵌套滑动机制（NestedScrolling） gg163 android移动开发滑动机制嵌套
    谷歌在发布安卓 Lollipop版本之后，为了更好的用户体验，Google为Android的滑动机制提供了NestedScrolling特性 NestedScrolling的特性可以体现在哪里呢？<!--[if !supportLineBreakNewLine]--><!--[endif]--> 比如你使用了Toolbar，下面一个ScrollView，向上滚
  • 使用hovertree菜单作为后台导航 hvt JavaScriptjquery.nethovertreeasp.net
      hovertree是一个jquery菜单插件，官方网址：http://keleyi.com/jq/hovertree/ ，可以登录该网址体验效果。 0.1.3版本：http://keleyi.com/jq/hovertree/demo/demo.0.1.3.htm hovertree插件包含文件： http://keleyi.com/jq/hovertree/css
  • SVG 教程 （二）矩形 天梯梦 svg
    SVG <rect> SVG Shapes SVG有一些预定义的形状元素，可被开发者使用和操作： 矩形 <rect> 圆形 <circle> 椭圆 <ellipse> 线 <line> 折线 <polyline> 多边形 <polygon> 路径 <path>
  • 一个简单的队列 luyulong java数据结构队列
    public class MyQueue { private long[] arr; private int front; private int end; // 有效数据的大小 private int elements; public MyQueue() { arr = new long[10]; elements = 0; front
  • 基础数据结构和算法九：Binary Search Tree sunwinner Algorithm
      A binary search tree (BST) is a binary tree where each node has a Comparable key (and an associated value) and satisfies the restriction that the key in any node is larger than the keys in all
  • 项目出现的一些问题和体会 Steven-Walker DAOWebservlet
         第一篇博客不知道要写点什么，就先来点近阶段的感悟吧。     这几天学了servlet和数据库等知识，就参照老方的视频写了一个简单的增删改查的，完成了最简单的一些功能，使用了三层架构。 dao层完成的是对数据库具体的功能实现，service层调用了dao层的实现方法，具体对servlet提供支持。  &
  • 高手问答：Java老A带你全面提升Java单兵作战能力！ ITeye管理员 java
    本期特邀《Java特种兵》作者：谢宇，CSDN论坛ID: xieyuooo 针对JAVA问题给予大家解答，欢迎网友积极提问，与专家一起讨论! 作者简介： 淘宝网资深Java工程师，CSDN超人气博主，人称“胖哥”。 CSDN博客地址： http://blog.csdn.net/xieyuooo 作者在进入大学前是一个不折不扣的计算机白痴，曾经被人笑话过不懂鼠标是什么，
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他