当前位置： 首页 > news >正文

Vue 基础

news 来源：原创 2024/4/29 9:20:56

知识铺垫

VScode 中 Vue 插件

  1. Vue 3 Snippets
  2. Vetur

axios

axios 是一个专注于网络请求的库！

axios 的基本使用（前提npm了axios或者导入了axios的js文件）：

  1. 发起 GET 请求：

    axios({
  // 请求方式
  method: 'GET',
  // 请求的地址
  url: 'http://www.example.xyz/xxx',
  // URL 中的查询参数
  params: {
    id: 1
  }
}).then(function (result) {
  console.log(result)
})

  2. 发起 POST 请求：

    document.querySelector('#btnPost').addEventListener('click', async function () {
  // 如果调用某个方法的返回值是 Promise 实例，则前面可以添加 await！
  // await 只能用在被 async “修饰”的方法中
  const { data: res } = await axios({
    method: 'POST', 
    url: 'http://www.example.xyz/xxx',
    data: {
      name: 'zs',
      age: 20
    }
  })
  console.log(res)
})

Vue 2

vue2加速链接

#开发环境版本，包含了有帮助的命令行警告

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

vue3官网：–>

https://cn.vuejs.org

vue2官网：–>

https://v2.cn.vuejs.org/

什么是 vue

  1. 构建用户界面
    • 用 vue 往 html 页面中填充数据，非常的方便
  2. 框架
    • 框架是一套现成的解决方案，程序员只能遵守框架的规范，去编写自己的业务功能！
    • 要学习 vue，就是在学习 vue 框架中规定的用法！
    • vue 的指令、组件（是对 UI 结构的复用）、路由、Vuex、vue 组件库
    • 只有把上面老师罗列的内容掌握以后，才有开发 vue 项目的能力！

vue 的两个特性

  1. 数据驱动视图：

    • vue 会监听数据的变化，数据的变化会驱动视图自动更新，单向。
    • 好处：程序员只管把数据维护好，那么页面结构会被 vue 自动渲染出来！

  2. 双向数据绑定：

    • 在网页中，form 表单负责采集数据，Ajax 负责提交数据。
    • js 数据的变化，会被自动渲染到页面上。
    • 页面上表单采集的数据发生变化的时候，会被 vue 自动获取到，并更新到 js 数据中。

注意：数据驱动视图和双向数据绑定的底层原理是 MVVM（Mode 数据源、View 视图、ViewModel 就是 vue 的实例）

image-20221011112604101

MVVM 指的是 Model、View 和 ViewModel，它把每个 HTML 页面都拆分成了这三个部分(上图)。在 MVVM 概念中：

  • Model 表示当前页面渲染时所依赖的数据源。
  • View 表示当前页面所渲染的 DOM 结构。
  • ViewModel 表示 vue 的实例，它是 MVVM 的核心。

Vue2模板

image-20221011112837910

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Vue2</title>
</head>
<body>
  <div id="app">
    {{ msg }}
  </div>
  <!-- 引入 vue.js -->
  <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
  <script>
    var app = new Vue({
      // vue挂载的位置，id为app的一个div上
      el: "#app",
      // vue要渲染的数据
      data:{
        msg: "hello vue"
      }
    })
  </script>
</body>
</html>

Vue 调试工具

安装 vue-devtools 调试工具：

vue 官方提供的 vue-devtools 调试工具，能够方便开发者对 vue 项目进行调试与开发。

  • Chrome 浏览器在线安装 vue-devtools ，使用此网址直接搜vue-devtools：https://chrome.zzzmh.cn/index#/index
  • FireFox 浏览器在线安装 vue-devtools ：https://addons.mozilla.org/zh-CN/firefox/addon/vue-js-devtools/

插件下载好的安装具体说明在文档中包含。安装好后重启浏览器即可。

之后打开调试面板即可看到 Vue 面板。

image-20221011113509059

image-20221011113756345

vue指令

指令（Directives）是 vue 为开发者提供的模板语法，用于辅助开发者渲染页面的基本结构。

指令具体按照用途可以分为如下六大类：

  • ① 内容渲染指令

  • ② 属性绑定指令

  • ③ 事件绑定指令

  • ④ 双向绑定指令

  • ⑤ 条件渲染指令

  • ⑥ 列表渲染指令

注意：指令是 vue 开发中最基础、最常用、最简单的知识点。

内容渲染

  • {{ }} 插值表达式：在实际开发中用的最多，只是内容的占位符，不会覆盖原有的内容！例如上图模板{{ msg }}。

  • v-text：把数据按文本输出

  • v-html：若数据文本带有h5标签，则会渲染输出。相当于设置元素的 innerHTML

例如：

v-text="<a href='https://roydon.xyz'>roydon</a>";
<!-- 输出<a href='https://roydon.xyz'>roydon</a> -->

v-html="<a href='https://roydon.xyz'>roydon</a>";
<!-- 输出roydon超链接 -->

image-20221005224113543

属性绑定

  • v-bind: 指令，为元素的属性动态绑定值。简写为英文的 :

注意：v-bind 是为元素的属性attitude动态绑定值，例如class，src，id，type…

<div v-bind:class="divClass">div内容区域</div>
<h1 :class="myh1">h1标题</h1> 
<!-- v-bind 简写为: -->
<div :class="divClass">div内容区域</div>
<!--  如果绑定内容需要进行动态拼接，则字符串的外面应该包裹单引号  -->
<div :class="'divClass' + index">这是一个 div</div>

image-20221006101956334

事件绑定

  • v-on，简写为@

主要是为元素绑定事件，事件名称自定义，methods里写对应方法即可。

<div id="app">
    <input type="button" value="点击触发" v-on:click="方法名">
    <input type="button" value="双击触发" v-on:dblclick="方法名">
    <input type="button" value="点击触发" @click="方法名">
    <input type="text" value="回车触发事件" @keyup.enter="方法名">
</div>

image-20221006101424396

  • $event 是 vue 提供的特殊变量，用来表示原生的事件参数对象 event。$event 可以解决事件参数对象 event 被覆盖的问题。

如果是html原生元素，$event代表获取元素的 DOM 对象；

如果是自定义组件，如饿了么ui，vant组件的非html元素，$event获取的是组件当前的值，此时的$event相当于参数。

<div id="app">
    <input type="button" :value="count" @click="add(10,$event)" />
</div>
<!-- vue -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
    var app = new Vue({
        el: "#app",
        data: {
            count: 0
        },
        methods: {
            add(num, e) {
                this.count += num
                console.log(e)//打印的是对应的元素dom对象
            }
        },
    })
</script>
  • 事件修饰符

在事件处理函数中调用 event.preventDefault() 或 event.stopPropagation() 是非常常见的需求。

因此，vue 提供了事件修饰符的概念，来辅助程序员更方便的对事件的触发进行控制。

  • .prevent

    <a @click.prevent="xxx">链接</a>

  • .stop

    <button @click.stop="xxx">按钮</button>

    等…

常用的 5 个事件修饰符如下：

image-20221011160314501

  • 按键修饰符

在监听键盘事件时，我们经常需要判断详细的按键。此时，可以为键盘相关的事件添加按键修饰符，例如：

<div id="app">
  {{ msg }}<br>
  <input @keyup.enter="submit" /><br>
  <input @keyup.esc="clear" />
</div>
<!-- 引入 vue.js -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
  var app = new Vue({
    el: "#app",
    data: {
      msg: "hello vue2",
    },
    methods: {
      submit() {
        alert("点击了enter回车键")
      },
      clear() {
        alert("点击了esc退出键")
      }
    },
  })
</script>

条件渲染

条件渲染指令用来辅助开发者按需控制 DOM 的显示与隐藏。条件渲染指令有如下两个:

  • v-show：原理是 display 设为 none
  • v-if：原理是动态地创建或移除 DOM 元素

⚫ 如果需要非常频繁地切换，则使用 v-show 较好

⚫ 如果在运行时条件很少改变，则使用 v-if 较好

在实际开发中，绝大多数情况，不用考虑性能问题，直接使用 v-if 就好了！！！

  • v-else

v-if 可以单独使用，或配合 v-else 指令一起使用：

<div id="app">
  <h1 v-if="number>=60">成绩合格</h1>
  <h1 v-else>成绩不及格</h1>
</div>
<!-- 引入 vue.js -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
  var app = new Vue({
    el: "#app",
    data: {
      number: 90
    }
  })
</script>
  • v-else-if 
<div id="app">
  <h1 v-if="number>=80">成绩优秀！</h1>
  <h1 v-else-if="number>=60&number<80">成绩合格</h1>
  <h1 v-else>成绩不及格</h1>
</div>
<!-- 引入 vue.js -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
  var app = new Vue({
    el: "#app",
    data: {
      number: 90
    }
  })
</script>

注意：v-else 和 v-else-if 指令都必须配合 v-if 指令一起使用，否则将不会被识别！

双向绑定

  • v-model 双向数据绑定，用于表单当中。

表单数据的变化会动态改变data中数据的值。

data中数据值的变化动态渲染到绑定v-model的元素中。

为了方便对用户输入的内容进行处理，vue 为 v-model 指令提供了 3 个修饰符，分别是：

image-20221011161906840

<div id="app">
    <input type="text" v-model="content" />
    <h1>{{content}}</h1>
</div>
<!-- vue -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
    var app = new Vue({
        el: "#app",
        data: {
            content: ''
        },
        methods: {
        },
    })
</script>

列表渲染

  • v-for

vue 提供的列表渲染指令，用来辅助开发者基于一个数组来循环渲染一个列表结构，语法格式：

<!-- item就是循环数组的每一项； person 就是待循环的数组 -->
<h1 v-for="item in person">
    姓名：{{ item.name }}
</h1>
<!-- 同时还可以遍历出每一项的索引值(可选参数) -->
<h1 v-for="(item,index) in person">
    姓名：{{ item.name }}
    索引：{{ index }}
</h1>
<!-- v-for 指令中的item和index都是形参，可任意指定符合规范的名字 -->
//
data: {
  person: [
	{id: 1,name: 'roydon'},	
    {id: 2,name: 'yicheng'}
  ]
}

如下：

注意：遍历时必须要绑定一个 key，推荐使用 id，key 值类型为数字或者字符串（number/string）。

注意 key 值重复会报错：Duplicate keys detected。

索引 index 不具有唯一性，不推荐当作 key。

<div id="app">
    <!-- <div v-for="item in imgSrc" :key="item.id">
        <img alt="" :src="item.urll" />
    </div> -->
    <!-- index：元素索引 -->
    <img alt="" v-for="(item,index) in imgSrc" :key="item.id" :src="item.urll" />
</div>
<!-- vue.js -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
    var app = new Vue({
        el: "#app",
        data: {
            imgSrc: [
                { id: 1, urll: "https://img1.imgtp.com/2022/10/02/x2zOdyMi.png" },
                { id: 2, urll: "https://img1.imgtp.com/2022/10/02/6OcEDlzP.png" },
                { id: 3, urll: "https://img1.imgtp.com/2022/10/02/PCii39ly.png" },
            ],
        }
    })
</script>

案例：品牌列表 P56

过滤器*

**过滤器（Filters）**是 vue 为开发者提供的功能，常用于文本的格式化。

过滤器可以用在两个地方：插值表达式和 v-bind 属性绑定。

不过，在 Vue3 中剔除了过滤器，所以也不必掌握。

过滤器应该被添加在 JavaScript 表达式的尾部，由管道符'|'进行调用，示例代码如下

<div id="app">
  <!-- 在双花括号中通过管道符调用 capitalize 过滤器，对 msg 的值进行格式化 -->
  <h1>{{ msg | capitalize }}</h1>
  <!-- 在 v-bind 中通过管道符调用 formatId 过滤器，对 rawId 的值进行格式化 -->
  <div v-bind:id="rawId | formatId"></div>
</div>

定义过滤器

创建Vue示例后，可以在 filters 节点中定义·过滤器，示例代码如下：

<div id="app">
  <h1>{{msg | capitalize}}</h1>
</div>
<!-- 引入 vue.js -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
  var app = new Vue({
    el: "#app",
    data: {
      msg: "hello",
    },
    filters: {
      capitalize(msg) {
        // 首字母转大写
        return msg.charAt(0).toUpperCase() + msg.slice(1)
      }
    }
  })
</script>

私有过滤器

在 filters 节点下定义的过滤器称为私有过滤器，因为它只能在此Vue实例挂载的元素中使用。

全局过滤器

定义一个全局可用的过滤器：Vue.filter()

<div id="app">
  <h1>{{msg | capitalize}}</h1>
</div>
<!-- 引入 vue.js -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
  // 定义全局可用过滤器
  Vue.filter('capitalize', (msg) => {
    return msg.toUpperCase()
  })
  var app = new Vue({
    el: "#app",
    data: {
      msg: "hello",
    }
  })
</script>

连续调用多个全局过滤器：

{{msg | filterA | filterB}}
<!-- msg 先由 filterA 处理，处理之后的值交由 filterB 处理 -->

过滤器传参

过滤器的本质就是 JavaScript 函数，因此可以接收参数，例如：

<h1>{{msg | filterA(arg1,arg2)}}</h1>
// 第一个参数永远是管道符之前待处理的值
Vue.filter('filterA', (msg,arg1,arg2) => {
  // 代码逻辑
})

例如下方案例：控制字符长度

<div id="app">
  <h1>{{msg | capitalize | maxLength(5)}}</h1>
</div>
<!-- 引入 vue.js -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
  Vue.filter('capitalize', (msg) => {
    return msg.toUpperCase()
  })
  Vue.filter('maxLength', (str, len = 20) => {
    console.log(len);// 无论形参赋何值，len只等于过滤器传进来的值。所以此处打印 5
    if (str.length <= len) return str
    return str.slice(0, len) + '...'
  })
  var app = new Vue({
    el: "#app",
    data: {
      msg: "hello vue2.js",
    }
  })
</script>

watch 侦听器

watch 侦听器允许开发者监视数据的变化，从而针对数据的变化做特定的操作。语法格式如下：

<div id="app">
  <h1>{{msg}}</h1>
  <input v-model:value="msg" style="border: none;">
</div>
<!-- 引入 vue.js -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
  var app = new Vue({
    el: "#app",
    data: {
      msg: "hello vue2.js",
    },
    watch: {
      msg(newVal, oldVal) {
        console.log(newVal + '|' + oldVal);
      }
    }
  })
</script>

image-20221011181237152

immediate 选项

默认情况下，组件在初次加载完毕后不会调用watch 侦听器。如果想让watch 侦听器立即被调用，则需要使用immediate 选项。示例代码如下：

<div id="app">
  <h1>{{msg}}</h1>
  <input v-model:value="msg" style="border: none;">
</div>
<!-- 引入 vue.js -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
  var app = new Vue({
    el: "#app",
    data: {
      msg: "hello vue2.js",
    },
    watch: {
      msg: {
        // handler 是固定写法，表示当 msg 的值变化时，自动调用 handler 处理函数
        handler: async function (newVal) {
          if (newVal === '') return
          // 判断值是否合法的 axios，前提是先导入axios模块，这里就不演示了
          const { data: res } = await axios.get('https://www.escook.cn/api/finduser/' + newVal)
          console.log(res)
        },
        // 表示页面初次渲染好之后，就立即触发当前的 watch 侦听器
        immediate: true
      }
    }
  })
</script>

deep 选项

如果 watch 侦听的是一个对象，如果对象中的属性值发生了变化，则无法被监听到。此时需要使用 deep 选项

<div id="app">
  <h1>{{userInfo}}</h1>
  <input v-model:value="userInfo.name">
</div>
<!-- 引入 vue.js -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
  var app = new Vue({
    el: "#app",
    data: {
      userInfo: {
        name: 'roydon',
        age: 18
      }
    },
    watch: {
      userInfo: {
        handler(newVal) {
          console.log(newVal.name);
        },
        deep: true
      }
    }
  })
</script>

image-20221011182938840

监听对象单个属性

watch: {
  'userInfo.age': {
    handler(newVal) {
      console.log(newVal);
    },
    deep: true
  }
}

so：

  1. 方法格式的侦听器
    • 缺点1：无法在刚进入页面的时候，自动触发！！！
    • 缺点2：如果侦听的是一个对象，如果对象中的属性发生了变化，不会触发侦听器！！！
  2. 对象格式的侦听器
    • 好处1：可以通过 immediate 选项，让侦听器自动触发！！！
    • 好处2：可以通过 deep 选项，让侦听器深度监听对象中每个属性的变化！！！

计算属性

计算属性指的是通过一系列运算之后，最终得到一个属性值。这个动态计算出来的属性值可以被模板结构或methods 方法使用

<div id="app">
  <h1>{{ rgb }}</h1>
  <input type="button" value="获取rgb" @click="show">
</div>
<!-- 引入 vue.js -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
  var app = new Vue({
    el: "#app",
    data: {
      r: 10, g: 20, b: 30
    },
    computed:{
      rgb(){
        return `rgb(${this.r+10},${this.g-10},${this.b*1})`
      }
    },
    methods: {
      show(){
        // 注意此处不加括号
        console.log(this.rgb);
      }
    },
  })
</script>

注意：虽然声明的时候被定义为方法，但是计算属性的本质是一个属性

计算属性会缓存计算的结果，只有计算属性依赖的数据变化时才会重新运算

单页面应用

单页面应用程序（英文名：Single Page Application）简称SPA。

只有一个 html 页面。记住 Vue 就是单页面即可，就是往一个页面塞组件。因为 Vue 的观念就是组件化：

后续讲解 Vue-cli 创建出一个完整的 Vue2 项目如下图就可以直观的看到：

image-20221011184808371

vue-cli

vue-cli 是Vue.js 开发的标准工具。它简化了程序员基于webpack 创建工程化的Vue 项目的过程。

官网：https://cli.vuejs.org/zh/

安装：

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

创建一个项目（名字为 my-project）：

vue create my-project
# 或者
vue ui

具体创建步骤前往：https://blog.csdn.net/m0_51390535/article/details/126966696

如果命令行界面创建时进度条不动了，可以：

ctrl + d

vue 项目中 src 目录的构成：

assets 文件夹：存放项目中用到的静态资源文件，例如：css 样式表、图片资源
components 文件夹：程序员封装的、可复用的组件，都要放到 components 目录下
main.js 是项目的入口文件。整个项目的运行，要先执行 main.js
App.vue 是项目的根组件。

Vue 项目运行流程

在工程化的项目中，vue 要做的事情很单纯：通过main.js 把App.vue 渲染到index.html 的指定区域中。

其中：

① App.vue 用来编写待渲染的模板结构

② index.html 中需要预留一个el 区域

③ main.js 把App.vue 渲染到了index.html 所预留的区域中

Vue 组件

组件化开发指的是：根据封装的思想，把页面上可重用的UI 结构封装为组件，从而方便项目的开发和维护。

组件系统是 Vue 的另一个重要概念，因为它是一种抽象，允许我们使用小型、独立和通常可复用的组件构建大型应用。仔细想想，几乎任意类型的应用界面都可以抽象为一个组件树：

Component Tree

每个.vue 组件都由3 部分构成，分别是：

image-20221011185937911

  • template -> 组件的模板结构，它不会被渲染成dom，只能包含唯一的根节点

  • script -> 组件的JavaScript 行为，export中的 data 必须是一个函数。

  • style -> 组件的样式css

其中，每个组件中必须包含template 模板结构，而script 行为和style 样式是可选的组成部分。

使用组件

注册私有组件

例如在 App.vue 中使用 vue-cli 创建项目时生成的 HelloWorld.vue 组件。

步骤一：import 导入组件

import HelloWorld from "./components/HelloWorld.vue";

步骤二：使用 components 节点注册组件

export default {
  name: "App",
  components: {
	// 名称就是导入时定义的名称
    HelloWorld,
  },
};

步骤三：以标签的形式使用组件

<div id="app">
  <HelloWorld msg="Welcome to Your Vue.js App" />
</div>

注册全局组件

在vue 项目的 main.js 入口文件中，通过Vue.component()方法，可以注册全局组件。

import Vue from 'vue'
import App from './App.vue'

// 导入全局组件
import HelloWorld from '@/components/HelloWorld.vue'
Vue.component('MyHelloWorld',HelloWorld)

Vue.config.productionTip = false

new Vue({
  render: h => h(App),
}).$mount('#app')

做笔记时用的Typora 代码块可以用 vue ，csdn赶紧更新。暂时凑合看吧。

相关文章：

  • Ts/Typescript基础运用
  • 嵌入注意力机制的多尺度深度可分离表情识别--2021.宋玉琴
  • 页面登录功能的思路
  • ShardingSphere 5.2.0：分片审计功能拦截多分片场景下的不合理请求
  • 毕业设计 单片机stm32智能大棚监控护理系统 - lora 远程通信
  • 关于QCefView的一些事
  • b站pink老师JavaScript的jQuery 案例代码——电梯导航案例
  • Python快速实现简易飞机大战小游戏
  • PowerWorld仿真与电力系统潮流计算（牛顿拉夫逊法和高斯赛德尔法）（Matlab实现）
  • VSCode自动更新后关闭，重新打开后版本自动降级
  • Google Earth Engine（GEE）——如何处理阈值筛选后的结果没发生变化，以青藏高原NDBI为例
  • 数字验证学习笔记——SystemVerilog芯片验证4 ——数据类型
  • 行为树BT设计与实现
  • 基于神经网络的指纹识别,指纹比对技术何时出现
  • 【图像分割】基于差分进化算法优化模糊熵实现多级图像阈值分割附matlab代码
  • 《Javascript数据结构和算法》笔记-「字典和散列表」
  • C++入门教程（10）：for 语句
  • Consul Config 使用Git做版本控制的实现
  • CSS进阶篇--用CSS开启硬件加速来提高网站性能
  • express如何解决request entity too large问题
  • Flex布局到底解决了什么问题
  • java取消线程实例
  • Linux gpio口使用方法
  • PAT A1120
  • php的插入排序，通过双层for循环
  • Python连接Oracle
  • SQLServer之创建显式事务
  • ucore操作系统实验笔记 - 重新理解中断
  • 技术攻略】php设计模式(一)：简介及创建型模式
  • 你真的知道 == 和 equals 的区别吗？
  • 软件开发学习的5大技巧，你知道吗？
  • 探索 JS 中的模块化
  • 限制Java线程池运行线程以及等待线程数量的策略
  • 一个普通的 5 年iOS开发者的自我总结，以及5年开发经历和感想！
  • MPAndroidChart 教程：Y轴 YAxis
  • 阿里云API、SDK和CLI应用实践方案
  • ​iOS安全加固方法及实现
  • ​Z时代时尚SUV新宠：起亚赛图斯值不值得年轻人买？
  • ​用户画像从0到100的构建思路
  • # centos7下FFmpeg环境部署记录
  • ###51单片机学习（2）-----如何通过C语言运用延时函数设计LED流水灯
  • #define、const、typedef的差别
  • #我与Java虚拟机的故事#连载04：一本让自己没面子的书
  • (C++)八皇后问题
  • (NSDate) 时间 (time )比较
  • （超简单）构建高可用网络应用：使用Nginx进行负载均衡与健康检查
  • （附源码）php投票系统 毕业设计 121500
  • (附源码)计算机毕业设计ssm本地美食推荐平台
  • （亲测成功）在centos7.5上安装kvm,通过VNC远程连接并创建多台ubuntu虚拟机（ubuntu server版本）...
  • （算法）Travel Information Center
  • (一)基于IDEA的JAVA基础1
  • （转）编辑寄语：因为爱心，所以美丽
  • 、写入Shellcode到注册表上线
  • ... 是什么 ？... 有什么用处?
  • ./indexer: error while loading shared libraries: libmysqlclient.so.18: cannot open shared object fil