一篇文章搞懂vue基础(上)

01._初识vue

初识vue:

        1.想让Vue工作，就必须创建一个vue实例，且要传入一个配置对象；

        2.root容器里的代码依然符合html规范，只不过混入了一些特殊的vue语法

        3.root容器里的代码被称为【Vue模版】

        4.Vue实例和容器是一一对应的

        5.真实开发中只有一个Vue实例，并且会配合着组件一起使用

        6.{{×××}}中的×××要写成js表达式，且XXX可以自动读取到data中的所有属性

        7.一旦data中的数据发生改变，那么模版（页面）中用到该数据的地方也会自动更新

        注意区分：js表达式和js代码（语句）

          1.表达式：一个表达式会产生一个值，可以放在任何一个需要值的地方：

            （1） a

            (2)。 a+b

            (3). demo(1)

            (4).x===y?"a":"b";

          2.js代码（语句)

            (1)if(){}

            (2)for(){}

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>初识Vue</title><script src="../js/vue.js"></script><script>Vue.config.productionTip = false; //阻止vue在启动时生成生产提示</script></head><body><!-- 准备好一个容器 --><div id="root"><h1>hello,{{name}}</h1></div><script>//创建vue实例new Vue({el: "#root", //el用于指定当前vue实例为哪个容器服务，值通常为css选择器字符串// el:document.getElementById("root")data: {//data中用于存储数据，数据供el所指定的容器去使用，值我们暂时先写成一个对象name: "尚硅谷",},});</script></body>
</html>

02_Vue模版语法


        Vue模版语法有两大类：
            1.插值语法：
                功能：用于解析标签体内容
                写法：{{xxx}}，xxx是js表达式，且可以直接读取到data中的所有属性
            2.指令语法：
                功能：用于解析标签（包括：标签属性，标签内容，绑定事件。。。）
                举例：v-bind:href="xxx"或简写为：href="xxx",xxx同样需要写js表达式
                且可以直接读取到data中的所有属性
                备注：Vue中有很多的指令，且形式都是v-？？？，此时我们只拿v-bind举个例子

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>模版语法</title><script src="../js/vue.js"></script></head><body><!-- 准备好一个容器 --><div id="root"><h1>插值语法</h1><h3>你好,{{name}}</h3><hr /><h1>指令语法</h1><a v-bind:href="url">点我去尚硅谷学习1</a><a :href="url">点我去尚硅谷学习2</a></div></body><script>new Vue({el: "#root",data: {name: "jack",url: "http://www.atguigu.com",},});</script>
</html>

 03_数据绑定


    Vue中有2种数据绑定的方式：
        1.单向绑定(v-bind):数据只能从data流向页面
        2.双向绑定(v-model):数据不仅能从data流向页面。还可以从页面流向data
          备注：
            1.双向绑定一般都应用在表单类元素上（如：input   select等）
            2.v-model:value 可以简写为v-model.因为v-model默认收集的就是value值

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title><script src="../js/vue.js"></script></head><body><!-- 准备好一个容器 --><div id="root"><!-- 普通写法 --><!--   单向数据绑定：<input type="text" v-bind:value="name" /><br />双向数据绑定：<input type="text" v-model:value="name" /><br /> --><!-- 简写 -->单向数据绑定：<input type="text" :value="name" /><br />双向数据绑定：<input type="text" v-model="name" /><br /><!-- 如下代码是错误的，因为v-model只能应用在表单类元素（输入类元素）上 --><!-- <h2 v-model:x="name">你好啊</h2> --></div></body><script>new Vue({el: "#root",data: {name: "尚硅谷",},});</script>
</html>

04_el与data的两种写法


        data与el的2种写法
            1.el有两种写法
                （1）new Vue 时候配置el属性
                （2）先创建vue实例，随后再通过vm.$mount("#root")指定el的值
            2.data有2种写法
                （1）对象式
                （2）函数式
                如何选择：目前哪种写法都可以，以后学到组件时，data必须使用函数式，否则会报错
            3.一个重要的原则：
                由vue管理的函数，一定不要写箭头函数，一旦写了箭头函数，this就不再是vue实例了
 

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title><script src="../js/vue.js"></script></head><body><!-- 准备好一个容器 --><div id="root"><h1>你好，{{name}}</h1></div></body><script>const v = new Vue({// el: "#root",  //第一种写法//data的第一种写法：对象式/* data: {  name: "尚硅谷",}, */data() {console.log(this); //此处的this是vue实例对象return {name: "尚硅谷",};},});v.$mount("#root"); //第二种写法</script>
</html>

05_MVVM模型


        MVVM模型
            1.M：模型（Model）:data中的数据
            2.V: 视图（View）：模版代码
            3.VM：视图模型（ViewModel):Vue实例
        观察发现：
            1.data中所有的属性，最后都出现在了vm身上
            2.vm身上所有的属性，及Vue原型上所有的属性，在vue模版中都可以直接使用
 

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title><script src="../js/vue.js"></script></head><body><!-- 准备好一个容器 --><div id="root"><h1>学校名称：{{name}}</h1><h1>学校地址：{{address}}</h1><h1>测试一下1：{{1+1}}</h1><h1>测试一下2：{{#option}}</h1><h1>测试一下1：{{#emit}}</h1><h1>测试一下1：{{_c}}</h1></div></body><script>const vm = new Vue({el: "root",data: {name: "尚硅谷",address: "北京",},});</script>
</html>

06_数据代理

1.回顾Object.defineProperty方法

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title></head><body><script>let number = 18;let person = {name: "张三",sex: "男",};Object.defineProperty(person, "age", {//value:18,//enumerable:true,//控制属性是否可以枚举，默认值是false//writable:true,//控制属性是否可以被修改，默认值是false//configurable:true//控制属性是否可以被删除，默认值是false//当有人读取person的age属性时，get函数（getter）就会被调用，且返回值就是age的值get() {console.log("有人读取age属性了");return number;},//当有人修改person的age属性时，set函数（setter）就会被调用，且返回值就是age的值set(value) {console.log("有人修改了age属性，且值是value");number = value;},});</script></body>
</html>

2.何为数据代理

   数据代理：通过一个对象代理对另一个对象中属性的操作（读/写）

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title></head><body></body><script>let obj = {x: 100,};let obj2 = {y: 200,};Object.defineProperty(obj2, "x", {get() {return obj.x;},set(value) {obj.x = value;},});</script>
</html>

3.Vue中的数据代理

      1.Vue中的数据代理:

        通过vm对象来代理data对象中属性的操作（读/写）

      2.Vue中数据代理的好处:

        更加方便的操作data中的数据

      3.基本原理：

        通过Object.defineProperty()把data对象中所有的属性添加到vm 上。

        为每一个添加到vm的属性，都指定一个getter/setter

        在getter/setter内容去操作（读/写）data中对应的属性

07_事件处理

1.事件的基本使用


        事件的基本使用：
            1.使用v-on:xxx或@xxx 绑定事件，其中xxx是事件名;
            2.事件的回调需要配置在methods对象中，最终会在vm上；
            3.methods中配置的函数，不要用箭头函数！否则this就不是vm了；
            4.methods中配置的函数，都是被vue所管理的函数，this的指向是vm或组件实例对象
            5.@click="demo"和@click='demo($event)'效果一致，但后者可以传参

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title><script src="../js/vue.js"></script></head><body><!-- 准备好一个容器 --><div id="root"><h2>欢迎来到{{name}}学习</h2><!-- <button v-on:click = "showInfo">点我提示信息</button> --><button @click="showInfo1">点我提示信息1(不传参)</button><button @click="showInfo2">点我提示信息2(传参)</button></div></body><script>// 7.51  11.33  11.44const vm = new Vue({el: "#root",data: {name: "尚硅谷",},methods: {showInfo1(event) {//   console.log(event.target.innerText);console.log(this); //此处this是vmalert("同学你好！");},showInfo2(event, number) {//   console.log(event.target.innerText);console.log(this); //此处this是vmalert("同学你好！!");},},});</script>
</html>

2.事件修饰符

Vue中的事件修饰符：
            1.prevent:阻止默认事件（常用）
            2.stop:阻止事件冒泡（常用）
            3.once:事件只触发一次（常用）
            4.capture:使用事件的捕获模式
            5.self:只有event.target是当前操作的元素时才触发
            6.passive:事件的默认行为立即执行，无需等待事件回调执行完毕 

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title><script src="../js/vue.js"></script></head><body><!-- 准备好一个容器 --><div id="root"><h2>欢迎来到{{name}}学习</h2><!-- 阻止默认事件（常用） --><a href="http://www.atguigu.com" @click.prevent="showInfo">点我提示信息</a><!-- 阻止事件冒泡 --><div class="demo1" @click="showInfo"><button @click.stop="showInfo">点我提示信息</button><!-- 即阻止冒泡又阻止跳转事件 --><a href="http://www.atguigu.com" @click.prevent.stop="showInfo">点我提示信息</a></div><!-- 事件只触发一次 --><button @click.once="showInfo">点我提示信息</button></div></body><script>const vm = new Vue({el: "#root",data: {name: "尚硅谷",},methods: {showInfo(e) {alert("同学你好");},},});</script>
</html>

3.键盘事件

  1.Vue中常见的按键别名
            回车 => enter
            删除 => delete
            退出 => esc
            空格 => space
            换行 => tab（特殊，必须配合keydown去使用）
            上 => up
            下 => down
            左 => left
            右 => right
        2.Vue未提供别名的按键，可以使用按键原始的key值去绑定。但注意要转为kebab-case(短横线命名)
        3.系统修饰符(用法特殊)：ctrl,alt,shift,meta
            (1)配合keyup使用：按下修饰键的同时，再按下其他键，随后释放其他键，事件才被触发
            (2)配合keydown使用，正常触发事件
        4.也可以使用keyCode去指定具体的按键（不推荐）
        5.Vue.config.keyCodes自定义键名=键码，可以去定制按键别名

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title><script src="../js/vue.js"></script></head><body><!-- 准备好一个容器 --><div id="root"><h2>欢迎来到{{name}}学习</h2><inputtype="text"placeholder="按下回车提示输入"@keyup.ctrl="showInfo"/><!-- ctry和y键一起被摁下的时候，才能调用该函数 --><inputtype="text"placeholder="按下回车提示输入"@keyup.ctrl.y="showInfo"/></div></body><script>const vm = new Vue({el: "#root",data: {name: "尚硅谷",},methods: {showInfo(e) {console.log(e.target.value);},},});</script>
</html>

08_计算属性

1.姓名案例_插值语法实现

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title><script src="../js/vue.js"></script></head><body><div id="root">姓：<input type="text" v-model="firstName" /><br /><br />名: <input type="text" v-model="lastName" /><br /><br />全名：<span>{{firstName.slice(0,3)}}-{{lastName}}</span></div></body><script>new Vue({el: "#root",data: {firstName: "张",lastName: "三",},});</script>
</html>

2.姓名案例_methods实现

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title><script src="../js/vue.js"></script></head><body><div id="root">姓：<input type="text" v-model="firstName" /><br /><br />名: <input type="text" v-model="lastName" /><br /><br />全名：<span>{{fullName()}}</span></div></body><script>new Vue({el: "#root",data: {firstName: "张",lastName: "三",},methods: {fullName() {return this.firstName + "-" + this.lastName;},},});</script>
</html>

3.姓名实例_计算属性

计算属性：

        1.定义：要用的属性不存在，要通过已有属性计算得来。

        2.原理：底层借助了Object.defineproperty方法提供的getter和setter

        3.get函数什么时候执行？

          （1）初次读取时会执行一次

          （2）当依赖的数据发生改变时会被再次调用

        4.优势：与methods实现相比，内部有缓存机制（复用），效率高，调式方便

        5.备注：

          1.计算属性最终会出现在vm上，直接读取使用调用即可

          2.如果计算属性要被修改，那必须写set函数去响应修改，且set中要引起计算时依赖的数据发生变化

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title><script src="../js/vue.js"></script></head><body><div id="root">姓：<input type="text" v-model="firstName" /><br /><br />名: <input type="text" v-model="lastName" /><br /><br />全名：<span>{{fullName}}</span></div></body><script>new Vue({el: "#root",data: {firstName: "张",lastName: "三",},computed: {fullName: {//get有什么用？当有人读取fullName时，get就会被调用，且返回值就作为fullName的值//get什么时候调用？1.初次读取fullName时 2.所依赖的数据发生变化时get() {return this.firstName + "-" + this.lastName;},set(value) {const arr = value.split("-");this.firstName = arr[0];this.lastName = arr[1];},},},});</script>
</html>

4.计算属性简写

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title><script src="../js/vue.js"></script></head><body><div id="root">姓：<input type="text" v-model="firstName" /><br /><br />名: <input type="text" v-model="lastName" /><br /><br />全名：<span>{{fullName}}</span></div></body><script>new Vue({el: "#root",data: {firstName: "张",lastName: "三",},computed: {//完整写法/* fullName: {get() {return this.firstName + "-" + this.lastName;},set(value) {const arr = value.split("-");this.firstName = arr[0];this.lastName = arr[1];},}, *///简写fullName() {return this.firstName + "-" + this.lastName;},},});</script>
</html>

09_监视属性

1.天气案例

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title><script src="../js/vue.js"></script></head><body><div id="root"><h2>今天天气很{{info}}</h2><!-- <button @click="isHot = !isHot">切换天气</button> --><button @click="changeWeather">切换天气</button></div></body><script>new Vue({el: "#root",data: {isHot: true,},computed: {info() {return this.isHot ? "炎热" : "凉爽";},},methods: {changeWeather() {this.isHot = !this.isHot;},},});</script>
</html>

2.天气案例_监视属性


      监视属性watch:
        1.当被监视的属性变化时，回调函数自动调用，进行相关操作
        2.监视的属性必须存在，才能进行监视
        3.监视的两种写法:
          (1)new Vue传入watch配置
          (2)通过vm.$watch监视
     

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title><script src="../js/vue.js"></script></head><body><div id="root"><h2>今天天气很{{info}}</h2><button @click="changeWeather">切换天气</button></div></body><script>const vm = new Vue({el: "#root",data: {isHot: true,},computed: {info() {return this.isHot ? "炎热" : "凉爽";},},methods: {changeWeather() {this.isHot = !this.isHot;},},/* watch: {isHot: {immediate: true, //初始化时让hander调用//handler什么时候调用？当isHot发生改变时handler(newValue, oldValue) {console.log("isHot被修改了", newValue, oldValue);},},}, */});vm.$watch("isHot", {immediate: true, //初始化时让hander调用//handler什么时候调用？当isHot发生改变时handler(newValue, oldValue) {console.log("isHot被修改了", newValue, oldValue);},});</script>
</html>

3.天气案例_深度监视

深度监测：

        (1)Vue中的watch默认不监测对象内部值的改变（一层）

        (2)配置deep:true可以监测对象内部值改变(多层)

      备注：

        (1)Vue自身可以监测对象内部值的改变，但Vue提供的watch默认不可以

        (2)使用watch时根据数据的具体结构，决定是否采用深度监视

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title><script src="../js/vue.js"></script></head><body><div id="root"><h2>今天天气很{{info}},{{number.a}},{{number.a}}</h2><button @click="changeWeather">切换天气</button><hr /><button @click="number.a++">点我让a+1</button><button @click="number.b++">点我让b+1</button></div></body><script>const vm = new Vue({el: "#root",data: {isHot: true,number: {a: 1,b: 1,},},computed: {info() {return this.isHot ? "炎热" : "凉爽";},},methods: {changeWeather() {this.isHot = !this.isHot;},},watch: {isHot: {// immediate: true, //初始化时让hander调用//handler什么时候调用？当isHot发生改变时handler(newValue, oldValue) {console.log("isHot被修改了", newValue, oldValue);},},//监视多级结构中某个属性的变化/* "number.a": {handler() {console.log("a被改变了");},}, *///监视多级结构中所有属性的变化number: {deep: true,handler() {console.log("number改变了");},},},});</script>
</html>

4.监视属性_简写

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title><script src="../js/vue.js"></script></head><body><!-- 简写的前提：没有immediate和deep --><div id="root"><h2>今天天气很{{info}}</h2><button @click="changeWeather">切换天气</button></div></body><script>const vm = new Vue({el: "#root",data: {isHot: true,},computed: {info() {return this.isHot ? "炎热" : "凉爽";},},methods: {changeWeather() {this.isHot = !this.isHot;},},watch: {//正常写法/* isHot: {// immediate: true, //初始化时让hander调用//deep:true//handler什么时候调用？当isHot发生改变时handler(newValue, oldValue) {console.log("isHot被修改了", newValue, oldValue);},}, *///简写/* isHot() {console.log("isHot被修改了", newValue, oldValue);}, */},});//正常的写法/* vm.$watch("isHot", {immediate: true, //初始化时让hander调用deep: true,//handler什么时候调用？当isHot发生改变时handler(newValue, oldValue) {console.log("isHot被修改了", newValue, oldValue);},}); *///简写vm.$watch("isHot", function () {console.log("isHot被修改了");});</script>
</html>

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/758654.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

《1w实盘and大盘基金预测 day8》

《1w实盘and大盘基金预测 day8》

昨日预测还行&#xff0c;大盘最低到3054缺口附近&#xff0c;并没有补缺口 &#xff0c;顶住了&#xff0c;震荡向上&#xff0c;评分B。 今天行情是指数涨却赚不到钱&#xff0c;像极了拉指数掩护蓝筹股出货 公众号&#xff1a;JavaHelmet 昨天预测&#xff1a; 3042-305…
阅读更多...
大数据开发（Hadoop面试真题）

大数据开发（Hadoop面试真题）

大数据开发&#xff08;Hadoop面试真题&#xff09; 一、HDFSⅠ、HDFS基础概念和架构1、HDFS的作用2、介绍下HDFS&#xff0c;说下HDFS优缺点&#xff0c;以及使用场景&#xff1f;3、请解释一下Hadoop中NameNode和DataNode的作用。4、请解释一下HDFS架构中NameNode和DataNode之…
阅读更多...
一文带你了解MySQL事务特性以及其底层原理

一文带你了解MySQL事务特性以及其底层原理

MySQL的事务支持是通过其存储引擎&#xff0c;特别是InnoDB存储引擎来提供的。事务的四大特性&#xff0c;通常被称为ACID属性&#xff0c;分别是原子性&#xff08;Atomicity&#xff09;、一致性&#xff08;Consistency&#xff09;、隔离性&#xff08;Isolation&#xff0…
阅读更多...
Linux中，运行程序，顺便将打印信息存储在Log文件中查看

Linux中，运行程序，顺便将打印信息存储在Log文件中查看

前言 如题&#xff0c;原本打算在代码中自己写一个类去管理将打印信息收集到log日志中&#xff0c;忽然想到&#xff0c;其实也可以写sh脚本 简单demo1 #!/bin/bash# 启动应用程序 test&#xff0c;并将标准输出和标准错误输出都追加到 log 文件中 ./test >> output.log…
阅读更多...
使用 mypy 做 type check

使用 mypy 做 type check

前言 完残&#xff01;&#x1f602;&#xff0c;最近看之前写的 Python 代码老得琢磨这比变量的类型是啥&#xff08;Python 无类型系统xxx&#xff09;&#xff0c;不愧是我写的&#xff01; 看段之前写的实现迭代器模式的代码&#xff1a; # 抽象迭代器类 class Iterator(…
阅读更多...
7-7 12-24小时制

7-7 12-24小时制

题目链接&#xff1a;7-7 12-24小时制 一. 题目 1. 题目 2. 输入输出格式 3. 输入输出样例 4. 限制 二、代码 1. 代码实现 #include <stdio.h>int main(void) {int hour, minute;char *str;if (scanf("%d:%d", &hour, &minute) ! 2) {return -1;}i…
阅读更多...
操作系统系列学习——死锁处理

操作系统系列学习——死锁处理

文章目录 前言死锁处理 前言 一个本硕双非的小菜鸡&#xff0c;备战24年秋招&#xff0c;计划学习操作系统并完成6.0S81&#xff0c;加油&#xff01; 本文总结自B站【哈工大】操作系统 李治军&#xff08;全32讲&#xff09; 老师课程讲的非常好&#xff0c;感谢 【哈工大】操…
阅读更多...
如何优惠申请DigiCert证书

如何优惠申请DigiCert证书

DigiCert作为全球知名的数字证书颁发机构&#xff0c;其SSL证书以高度的安全性和信任度广受认可。而JoySSL作为国内优秀的SSL证书服务平台&#xff0c;提供了便捷、高效的证书申请服务&#xff0c;让您能够轻松获取并安装DigiCert SSL证书。接下来&#xff0c;本文将详细介绍如…
阅读更多...
pytest相关面试题

pytest相关面试题

pytest是什么&#xff1f;它有什么优点&#xff1f; pytest是一个非常流行的Python测试框架&#xff0c;它具有简洁、易用、高校等优点。他可以帮助测试人员方便地编写和运行测试用例&#xff0c;并且提供了丰富的插件和扩展&#xff0c;支持各种测试需求介绍下pytest常用的库 …
阅读更多...
什么情况用@RequestBody、@RequestParm、@PathVariable

什么情况用@RequestBody、@RequestParm、@PathVariable

1.requestParam(请求参数&#xff09;&#xff1a;使用RequestParam注释将请求参数绑定到控制器中的方法参数。用于从请求访问查询参数值的RequestParam注释。 如下请求URL&#xff1a;http://localhost:8080/springmvc/hello/101?param110&param220 以下是RequestParam注…
阅读更多...
腾讯云服务器怎么买省钱？先领券，再下单！

腾讯云服务器怎么买省钱？先领券，再下单！

腾讯云代金券领取渠道有哪些&#xff1f;腾讯云官网可以领取、官方媒体账号可以领取代金券、完成任务可以领取代金券&#xff0c;大家也可以在腾讯云百科蹲守代金券&#xff0c;因为腾讯云代金券领取渠道比较分散&#xff0c;腾讯云百科txybk.com专注汇总优惠代金券领取页面&am…
阅读更多...
网工内推 | 七险一金，上市公司招信息安全工程师，大牛带队

网工内推 | 七险一金，上市公司招信息安全工程师，大牛带队

01 启明星辰信息技术集团股份有限公司 招聘岗位&#xff1a;数据安全服务工程师 职责描述&#xff1a; 1、负责数据安全服务项目的管理&#xff0c;统筹组织并协调资源落实项目交付实施; 3、负责数据安全风险评估、数据分类分级、数据安全管理制度、数据安全体系规划等数据安…
阅读更多...
企事业单位宣传，三下乡的稿子怎么在学习强国网投稿发稿，价格多少钱？

企事业单位宣传，三下乡的稿子怎么在学习强国网投稿发稿，价格多少钱？

随着学习强国成为各个企事业单位宣传的重要平台&#xff0c;如何在学习强国上发稿&#xff0c;尤其是三下乡的宣传稿件&#xff0c;成为了各位传媒工作者关注的焦点。在这里&#xff0c;我们要向大家介绍一下媒介多多网发稿平台&#xff0c;为大家提供一个便捷高效的投稿发稿渠…
阅读更多...
C#实现俄罗斯方块代码

C#实现俄罗斯方块代码

创建一个基本的俄罗斯方块游戏需要实现以下功能&#xff1a; 游戏区域的绘制&#xff1a;这是放置游戏方块的地方。方块的形状和旋转&#xff1a;俄罗斯方块有7种基本形状&#xff0c;每种形状都可以旋转。方块的移动&#xff1a;方块需要能够左移、右移以及下落。方块的固定&…
阅读更多...
STM32相关资料汇总

STM32相关资料汇总

STM32选型表 STM32手册参考网站 https://www.stmcu.org.cn/
阅读更多...
命名空间——初识c++

命名空间——初识c++

. 个人主页&#xff1a;晓风飞 专栏&#xff1a;数据结构|Linux|C语言 路漫漫其修远兮&#xff0c;吾将上下而求索 文章目录 经典的Hello Word 起航c关键字c语言的命名冲突问题域作用限定符::命名空间 namespace命名空间定义命名空间的使用1.加命名空间名称及作用域限定符2.使用…
阅读更多...
Thingworx高可用集群部署（四）-Pgpool-II安装

Thingworx高可用集群部署（四）-Pgpool-II安装

主机&#xff1a;10.10.10.71、10.10.10.72、10.10.10.73 VIP: 10.10.10.101 用户&#xff1a;postgres 配置互信 passwd postgres 密码 postgres vi /etc/sudoers postgres ALL(ALL) NOPASSWD: ALL su - postgres ssh-keygen ssh-keygen -t rsa -f .ssh/id_…
阅读更多...
【CNN轻量化】ParameterNet: Parameters Are All You Need 参数就是你所需要的

【CNN轻量化】ParameterNet: Parameters Are All You Need 参数就是你所需要的

论文链接&#xff1a;http://arxiv.org/abs/2306.14525 代码链接&#xff1a;https://github.com/huawei-noah/Efficient-AI-Backbones 一、摘要 现有的低FLOPs模型&#xff08;轻量化模型&#xff09;无法从大规模预训练中受益。本文旨在增加大规模视觉预训练模型中的参数数量…
阅读更多...
跟着cherno手搓游戏引擎【29】Batch简单合批

跟着cherno手搓游戏引擎【29】Batch简单合批

思路&#xff1a; CPU和GPU都开辟同样大小的一大块内存&#xff08;为了存储顶点信息&#xff09; 索引在程序运行时生成对应规则后绑定到索引缓冲中 动态生成顶点信息&#xff08;现在改成Drawquad只是确定图形顶点的位置&#xff09; 然后在Endscene&#xff0c;将CPU的动…
阅读更多...
蓝桥杯之简单数论冲刺

蓝桥杯之简单数论冲刺

文章目录 取模快速幂 取模 这道题目有两个注意点&#xff1a; 1.当你的取模之后刚好等于0的话&#xff0c;后面就不用进行后面的计算 2.if sum detail[i] > q: 这个语句的等号也很重要 import os import sys# 请在此输入您的代码a,b,n map(int,input().split())week a*5 …
阅读更多...
最新文章

Copyright @ 2022~2023