【Vue】简易博客项目跟做

项目框架搭建

1.使用vue create快速搭建vue项目

在这里插入图片描述

2.使用VC Code打开新生成的项目

在这里插入图片描述

  • 端口号简单配置

修改vue.config.js文件，内容修改如下

在这里插入图片描述

所需库安装

npm install vue-resource --save --no-fund

npm install vue-router@3 --save --no-fund

npm install axios --save --no-fund

关闭eslint检测

修改.eslintrc.js文件，注释掉'eslint:recommended'，并在rules中加上"vue/no-unused-components":"off"

不关闭检测，组件注册后未被使用时，会直接报错导致项目无法运行

在这里插入图片描述

前端网站开发

添加博客页

修改App.vue，注册AddBlog组件

<template><div id="app"><add-blog></add-blog></div>
</template><script>
import AddBlog from './components/AddBlog'
export default {name: 'app',components: {AddBlog}
}
</script><style>
</style>

编写AddBlog.vue代码

<template><div id="add-blog"><h2>添加博客</h2><form v-if="!submited"><label>博客标题</label><input type="text" v-model="blog.title" required /><label>博客内容</label><textarea v-model="blog.content"></textarea><div id="checkboxes"><label>Vue.js</label><input type="checkbox" value="Vue.js" v-model="blog.categories"><label>Node.js</label><input type="checkbox" value="Node.js" v-model="blog.categories"><label>React.js</label><input type="checkbox" value="React.js" v-model="blog.categories"><label>Angular4</label><input type="checkbox" value="Angular4" v-model="blog.categories"></div><label>作者：</label><select v-model="blog.author"><option v-for="author in authors" :key="author">{{ author }}</option></select><button v-on:click.prevent="post">添加博客</button></form><div v-if="submited"><h3>添加成功</h3></div><hr><!-- 展示预览区域 --><div id="preview"><h3>博客总览</h3><p>博客标题：{{ blog.title }}</p><p>博客内容：</p><p>{{ blog.content }}</p><p>博客分类：</p><ul><li v-for="category in blog.categories" :key="category">{{ category }}</li></ul><p>作者：</p><p>{{ blog.author }}</p></div></div>
</template><script>
export default {// 测试数据网站：https://jsonplaceholder.typicode.com/postsname: 'add-blog',data() {return {blog: {title: "",content: "",categories: [],author: ""},authors: ["cy", "fy", "cyfy"],submited: false}},methods: {post: function () {// 向指定网站发送post请求this.$http.post("https://jsonplaceholder.typicode.com/posts", {title: this.blog.title,body: this.blog.content,UserId: 1}).then(function (data) {	// 接受网站返回的数据this.submited = true;// console.log(data);});}}
}
</script><style scoped>
/* 针对id=add-blog下所有元素 */
#add-blog * {box-sizing: border-box;
}#add-blog {margin: 20px auto;max-width: 600px;padding: 20px;
}label {display: block;margin: 20px 0 10px;
}input[type="text"],
textarea,
select {display: block;width: 100%;padding: 8px;
}textarea {height: 200px;
}#checkboxes label {display: inline-block;margin-top: 0;
}#checkboxes input {display: inline-block;margin-right: 10px;
}button {display: block;margin: 20px 0;background: cyan;color: fff;border: 0;padding: 14px;border-radius: 4px;font-size: 18px;cursor: pointer;
}#preview {padding: 10px 20px;  		/* 内边距：上下边距 左右边距 */ border: 1px dotted #ccc;	/* 边框设置：边框大小 边框样式 边框颜色 */margin: 30px 0;				/* 外边距：上下边距 左右边距 */
}h3 {margin-top: 10px;			/* 上外边距	*/
}
</style>

编写main.js文件，注册使用VueResource组件

import Vue from 'vue'
// 导入vue-resource
import VueResource from 'vue-resource'
import App from './App.vue'
import store from './store'Vue.config.productionTip = false
// 使用VueResource
Vue.use(VueResource)new Vue({store,render: h => h(App),
}).$mount('#app')

运行效果

在这里插入图片描述 --------------------------------------------------
在这里插入图片描述

博客列表页

修改App.vue，注册ShowBlogs组件

<template><div id="app"><!-- <add-blog></add-blog> --><show-blogs></show-blogs></div>
</template><script>
import AddBlog from './components/AddBlog'
import ShowBlogs from './components/ShowBlogs'export default {name: 'app',components: {AddBlog,ShowBlogs}
}
</script><style>
</style>

编写ShowBlogs.vue代码

<template><div v-theme:column="'wide'" id="show-blogs"><h1>博客总览</h1><input type="text" v-model="search" placeholder="搜索" /><div class="single-blog" v-for="blog in filteredBlogs" :key="blog.id"><h2 v-rainbow>{{ blog.title | to-uppercase }}</h2><article>{{ blog.body | snippet }}</article></div></div>
</template><script>export default {name: 'show-blogs',data() {return {blogs: [],search: ""}},created() {this.$http.get('https://jsonplaceholder.typicode.com/posts').then(function (data) {// 截取前十条数据，赋值给blogs中this.blogs = data.body.slice(0, 10);})},computed: {// 过滤博客，筛选出符合条件的博客filteredBlogs: function () {return this.blogs.filter((blog) => {return blog.title.match(this.search) || blog.body.match(this.search);})}},filters: {// 标题字母全部转换为大写字母toUppercase(value) {return value.toUpperCase();},// 博客内容一次仅显示100字符，后面字符用“...”代替snippet(value) {return value.slice(0, 100) + "...";}},directives: {// 标题字体颜色随机"rainbow": {bind(el, binding, value) {el.style.color = "#" + Math.random().toString(16).slice(2, 8);}},// 根据属性值赋予博客列表最大宽度"theme": {bind(el, binding, value) {if (binding.value == 'wide') {el.style.maxWidth = "1260px";} else if (binding.value == 'narrow') {el.style.maxWidth = "560px";}if (binding.arg == 'column') {el.style.background = "#6677cc";el.style.padding = '20px';}}}}}
</script><style>
#show-blogs {max-width: 800px;margin: 0 auto;
}.single-blog {padding: 20px;margin: 20px 0;box-sizing: border-box;background: #eee;border: 1px dotted #aaa;
}#show-blogs a {color: #444;text-decoration: none;
}input[type="text"] {padding: 8px;width: 100%;box-sizing: border-box;
}
</style>

运行效果

在这里插入图片描述搜索
在这里插入图片描述

实现路由跳转

编写main.js文件，注册使用vue-router组件

import Vue from 'vue'
import VueResource from 'vue-resource'
import App from './App.vue'
import store from './store'
// 导入vue-router
import VueRouter from 'vue-router'
// 导入路由配置文件
import Routes from './routes/routes'Vue.config.productionTip = falseVue.use(VueResource)
// 使用VueRouter
Vue.use(VueRouter)// 创建路由
const router = new VueRouter({routes:Routes,// 去除路径上的#号mode:"history"
})new Vue({store,render: h => h(App),// 注册路由配置router:router
}).$mount('#app')

编写routes.js文件，配置路由跳转逻辑

import AddBlog from './../components/AddBlog';
import ShowBlogs from './../components/ShowBlogs';
export default[{path:"/",component:ShowBlogs},{path:"/add",component:AddBlog}
]

修改App.vue，注册BlogHeader组件实现导航栏功能

<template><div id="app"><!-- <add-blog></add-blog> --><!-- <show-blogs></show-blogs> --><blog-header></blog-header><router-view></router-view></div>
</template><script>
import AddBlog from './components/AddBlog'
import ShowBlogs from './components/ShowBlogs'
import BlogHeader from './components/BlogHeader'export default {name: 'app',components: {AddBlog,ShowBlogs,BlogHeader}
}
</script><style>
</style>

编写BlogHeader.vue代码

<template><nav><ul><li><router-link to="/" exact>博客总览</router-link><router-link to="/add" exact>博客发布</router-link></li></ul></nav>
</template><script>
export default({name:"blog-header"
})
</script><style scoped>
ul{/* 去除列表前面的符号“·” */list-style-type: none;/* 字体居中 */text-align:center;margin:0;
}
li{display: inline-block;margin: 0 px;
}
a{color:#fff;text-decoration: none;padding: 12px;border-radius: 5px;
}
nav{background: crimson;padding: 30px 0;margin-bottom: 40px;
}
.router-link-active{background: rgba(255,255,255,0.8);color: #444;
}
</style>

运行效果

在这里插入图片描述在这里插入图片描述

博客详情页

修改routes.js，增加详情页路由配置

import AddBlog from './../components/AddBlog';
import ShowBlogs from './../components/ShowBlogs';
import SingleBlog from './../components/SingleBlog';
export default[{path:"/",component:ShowBlogs},{path:"/add",component:AddBlog},{path:"/blog/:id",component:SingleBlog}
]

编写SingleBlog.vue代码，实现博客详情页

<template><div id="single-blog"><h1>{{ blog.title }}</h1><article>{{ blog.body }}</article></div>
</template><script>
export default({name:"single-blog",data(){return {// 获取URL路径上的id值id:this.$route.params.id,blog:{}}},created(){// 请求本地JSON数据this.$http.get('https://jsonplaceholder.typicode.com/posts/' + this.id).then(function(data){this.blog = data.body;})}
})
</script><style scoped>
#single-blog{max-width: 960px;margin: 0 auto;padding: 20px;background: #eee;border: 1px dotted #aaa;
}
</style>

修改ShowBlogs.vue，增加点击跳转

<template><div v-theme:column="'wide'" id="show-blogs"><h1>博客总览</h1><input type="text" v-model="search" placeholder="搜索" /><div class="single-blog" v-for="blog in filteredBlogs" :key="blog.id"><!-- 使用router-link实现路由跳转 --><router-link v-bind:to="'/blog/' + blog.id"><h2 v-rainbow>{{ blog.title | to-uppercase }}</h2><article>{{ blog.body | snippet }}</article></router-link></div></div>
</template>

运行效果

在这里插入图片描述

数据地址替换

因为https://jsonplaceholder.typicode.com/posts提供的数据是死的，并不能随意修改，所以改用https://vuedemo-b1233.firebaseio.com【别人搭建的firebase网站数据，可能会被关闭/移除】

使用axios

修改main.js，加入axios配置，替代vue-resource请求数据

import Vue from 'vue'
// import VueResource from 'vue-resource'
import App from './App.vue'
import store from './store'
import VueRouter from 'vue-router'
import Routes from './routes/routes'
import axios from 'axios'// 全局配置
axios.defaults.baseURL = 'https://vuedemo-b1233.firebaseio.com'Vue.config.productionTip = false// Vue.use(VueResource)
Vue.use(VueRouter)// 创建路由
const router = new VueRouter({routes:Routes,// 去除路径上的#号mode:"history"
})new Vue({store,render: h => h(App),router:router
}).$mount('#app')

修改所有博客主页，使用axios替代$http

修改ShowBlog.vue

<template><div v-theme:column="'wide'" id="show-blogs"><h1>博客总览</h1><input type="text" v-model="search" placeholder="搜索" /><div class="single-blog" v-for="blog in filteredBlogs" :key="blog.id"><router-link v-bind:to="'/blog/' + blog.id"><h2 v-rainbow>{{ blog.title | to-uppercase }}</h2><article>{{ blog.content | snippet }}</article></router-link></div></div>
</template><script>
import axios from 'axios'
export default {name: 'show-blogs',data() {return {blogs: [],search: ""}},created() {axios.get('/posts.json').then(function(data){return data.data;}).then((data) => {var blogsArray = [];for(let key in data){data[key].id = key;// 如果content为空，则将body的值赋予给content// 这么做的原因：因为数据有很多人修改，出现了很多错误数据if(!data[key].content){data[key].content = data[key].body;}blogsArray.push(data[key]);}// 截取前十条数据，赋值给blogs中this.blogs = blogsArray.slice(0, 10);})},computed: {filteredBlogs: function () {return this.blogs.filter((blog) => {return blog.title.match(this.search) || blog.content.match(this.search);})}},filters: {toUppercase(value) {return value.toUpperCase();},snippet(value) {return value.slice(0, 100) + "...";}},directives: {"rainbow": {bind(el, binding, value) {el.style.color = "#" + Math.random().toString(16).slice(2, 8);}},"theme": {bind(el, binding, value) {if (binding.value == 'wide') {el.style.maxWidth = "1260px";} else if (binding.value == 'narrow') {el.style.maxWidth = "560px";}if (binding.arg == 'column') {el.style.background = "#6677cc";el.style.padding = '20px';}}}}}
</script>

修改SingleBlog.vue

<template><div id="single-blog"><h1>{{ blog.title }}</h1><article>{{ blog.content }}</article></div>
</template><script>
import axios from 'axios'
export default({name:"single-blog",data(){return {id:this.$route.params.id,blog:{}}},created(){// 请求本地JSON数据axios.get('/posts/' + this.id + '.json').then((data) => {// 如果content为空，则将body的值赋予给contentif(!data.data.content){data.data.content = data.data.body;}this.blog =data.data;})}
})
</script>

修改AddBlog.vue

<template><div id="add-blog"><h2>添加博客</h2><form v-if="!submited"><label>博客标题</label><input type="text" v-model="blog.title" required /><label>博客内容</label><textarea v-model="blog.content"></textarea><div id="checkboxes"><label>Vue.js</label><input type="checkbox" value="Vue.js" v-model="blog.categories"><label>Node.js</label><input type="checkbox" value="Node.js" v-model="blog.categories"><label>React.js</label><input type="checkbox" value="React.js" v-model="blog.categories"><label>Angular4</label><input type="checkbox" value="Angular4" v-model="blog.categories"></div><label>作者：</label><select v-model="blog.author"><option v-for="author in authors" :key="author">{{ author }}</option></select><button v-on:click.prevent="post">添加博客</button></form><div v-if="submited"><h3>添加成功</h3></div><hr><div id="preview"><h3>博客总览</h3><p>博客标题：{{ blog.title }}</p><p>博客内容：</p><p>{{ blog.content }}</p><p>博客分类：</p><ul><li v-for="category in blog.categories" :key="category">{{ category }}</li></ul><p>作者：</p><p>{{ blog.author }}</p></div></div>
</template><script>
import axios from 'axios'
export default {// https://jsonplaceholder.typicode.com/postsname: 'add-blog',data() {return {blog: {title: "",content: "",categories: [],author: ""},authors: ["cy", "fy", "cyfy"],submited: false}},methods: {post: function () {axios.post("/posts.json", this.blog).then( (data) => {this.submited = true;console.log(data);});}}
}
</script>

运行效果

在这里插入图片描述

删除博客

修改SingleBlog.vue，增加删除逻辑

<template><div id="single-blog"><h1>{{ blog.title }}</h1><article>{{ blog.content }}</article><p>作者：{{ blog.author }}</p><p>分类：</p><ul><li v-for="category in blog.categories" :key="category">{{ category }}</li></ul><button @click="deleteSingleBlog()">删除</button></div>
</template><script>
import axios from 'axios'
export default({name:"single-blog",data(){return {id:this.$route.params.id,blog:{}}},created(){// 请求本地JSON数据axios.get('/posts/'+ this.id + '.json').then((data) => {// 如果content为空，则将body的值赋予给contentif(!data.data.content){data.data.content = data.data.body;}if(!data.data.categories){data.data.categories = [];}this.blog =data.data;})},methods:{deleteSingleBlog(){axios.delete('/posts/'+ this.id + '.json').then(response =>{console.log("删除成功");this.$router.push({path:'/'})})}}
})
</script>

运行效果：
在这里插入图片描述

博客编辑页

修改SingleBlog.vue，增加编辑页跳转

<template><div id="single-blog"><h1>{{ blog.title }}</h1><article>{{ blog.content }}</article><p>作者：{{ blog.author }}</p><p>分类：</p><ul><li v-for="category in blog.categories" :key="category">{{ category }}</li></ul><button @click="deleteSingleBlog()">删除</button><router-link :to="'/edit/' + id">编辑</router-link> </div>
</template>

修改router.js，增加编辑页跳转

import AddBlog from './../components/AddBlog';
import ShowBlogs from './../components/ShowBlogs';
import SingleBlog from './../components/SingleBlog';
import EditBlog from './../components/EditBlog';
export default[{path:"/",component:ShowBlogs},{path:"/add",component:AddBlog},{path:"/blog/:id",component:SingleBlog},{path:"/edit/:id",component:EditBlog}
]

编写EditBlog.vue，实现博客编辑页

<template><div id="edit-blog"><h2>编辑博客</h2><form v-if="!submited"><label>博客标题</label><input type="text" v-model="blog.title" required /><label>博客内容</label><textarea v-model="blog.content"></textarea><div id="checkboxes"><label>Vue.js</label><input type="checkbox" value="Vue.js" v-model="blog.categories"><label>Node.js</label><input type="checkbox" value="Node.js" v-model="blog.categories"><label>React.js</label><input type="checkbox" value="React.js" v-model="blog.categories"><label>Angular4</label><input type="checkbox" value="Angular4" v-model="blog.categories"></div><label>作者：</label><select v-model="blog.author"><option v-for="author in authors" :key="author">{{ author }}</option></select><button v-on:click.prevent="edit">编辑博客</button></form><div v-if="submited"><h3>编辑成功</h3></div><hr><div id="preview"><h3>博客总览</h3><p>博客标题：{{ blog.title }}</p><p>博客内容：</p><p>{{ blog.content }}</p><p>博客分类：</p><ul><li v-for="category in blog.categories" :key="category">{{ category }}</li></ul><p>作者：</p><p>{{ blog.author }}</p></div></div>
</template><script>
import axios from 'axios'
export default {name: 'edit-blog',data() {return {id:this.$route.params.id,blog: {title: "",content: "",categories: [],author: ""},authors: ["cy", "fy", "cyfy"],submited: false}},methods: {fetchDate(){axios.get('/posts/' + this.id + '.json').then(data =>{// 如果categories不存在，就给它赋值为空if(!data.data.categories){data.data.categories = [];}this.blog = data.data;})},edit: function () {axios.put('/posts/' + this.id + '.json',this.blog).then((data) => {this.submited = true;});}},created(){this.fetchDate();}
}
</script><style scoped>
/* 针对id=add-blog下所有元素 */
#edit-blog * {box-sizing: border-box;
}#edit-blog {margin: 20px auto;max-width: 600px;padding: 20px;
}label {display: block;margin: 20px 0 10px;
}input[type="text"],
textarea,
select {display: block;width: 100%;padding: 8px;
}textarea {height: 200px;
}#checkboxes label {display: inline-block;margin-top: 0;
}#checkboxes input {display: inline-block;margin-right: 10px;
}button {display: block;margin: 20px 0;background: cyan;color: fff;border: 0;padding: 14px;border-radius: 4px;font-size: 18px;cursor: pointer;
}#preview {/* 内边距 */padding: 10px 20px;/* 边框 */border: 1px dotted #ccc;/* 外边距 */margin: 30px 0;
}h3 {margin-top: 10px;
}
</style>

运行效果
在这里插入图片描述发布成功
在这里插入图片描述

整体项目结构

在这里插入图片描述

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

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

相关文章

python爬虫指南——初学者避坑篇

python爬虫指南——初学者避坑篇

目录 Python爬虫初学者学习指南一、学习方向二、Python爬虫知识点总结三、具体知识点详解和实现步骤1. HTTP请求和HTML解析2. 正则表达式提取数据3. 动态内容爬取4. 数据存储5. 反爬虫应对措施 四、完整案例&#xff1a;爬取京东商品信息1. 导入库和设置基本信息2. 获取网页内容…
阅读更多...
一文学习Android中的Treeview

一文学习Android中的Treeview

在Android开发中&#xff0c;TreeView是一种用于显示层次结构的组件&#xff0c;可以让用户展开和折叠子项&#xff0c;以方便查看数据的不同层次。TreeView在文件系统、组织架构、目录结构等场景中非常有用&#xff0c;尽管Android并未提供内置的TreeView控件&#xff0c;但可…
阅读更多...
如何快速搭建一个spring boot项目

如何快速搭建一个spring boot项目

一、准备工作 1.1 安装JDK&#xff1a;确保计算机上已安装Java Development Kit (JDK) 8或更高版本、并配置了环境变量 1.2 安装Maven&#xff1a;下载并安装Maven构建工具&#xff0c;这是Spring Boot官方推荐的构建工具。 1.3 安装代码编辑器&#xff1a;这里推荐使用Inte…
阅读更多...
SLM401A系列42V商业照明线性恒流芯片 线性照明调光在LED模组及灯带智能球泡灯上应用

SLM401A系列42V商业照明线性恒流芯片 线性照明调光在LED模组及灯带智能球泡灯上应用

SLM401A系列型号选型&#xff1a; SLM401A10ED-7G:QFN1010-4 SLM401A15aa-7G:SOT23-3 SLM401A20aa-7G:SOT23-3 SLM401A20ED-7G:QFN1010-4 SLM401A25aa-7G:SOT23-3 SLM401A30aa-7G:SOT23-3 SLM401A40aa-7G:SOT23-3 SLM401A50aa-7G:SOT23-3 SLM401A6…
阅读更多...
HTB：GreenHorn[WriteUP]

HTB：GreenHorn[WriteUP]

目录 连接至HTB服务器并启动靶机 使用nmap对靶机TCP端口进行开放扫描 再次使用nmap对这三个端口进行脚本、服务扫描 尝试先通过curl访问靶机80端口 将靶机IP与该域名写入hosts使DNS本地解析 使用浏览器访问greenhorn.htb 使用Wappalyzer插件查看该页面技术栈 尝试在sea…
阅读更多...
HarmonyOS-消息推送

HarmonyOS-消息推送

一. 服务简述 Push Kit&#xff08;推送服务&#xff09;是华为提供的消息推送平台&#xff0c;建立了从云端到终端的消息推送通道。所有HarmonyOS 应用可通过集成 Push Kit&#xff0c;实现向应用实时推送消息&#xff0c;使消息易见&#xff0c;构筑良好的用户关系&#xff0…
阅读更多...
精选 Top10 开源调度工具，解锁高效工作负裁自动化

精选 Top10 开源调度工具，解锁高效工作负裁自动化

在大数据和现代 IT 环境中&#xff0c;任务调度与工作负载自动化&#xff08;WLA&#xff09;工具是优化资源利用、提升生产效率的核心驱动力。随着企业对数据分析、实时处理和多地域任务调度需求的增加&#xff0c;这些工具成为关键技术。 本文将介绍当前技术发展背景下的Top …
阅读更多...
【论文阅读】Learning dynamic alignment via meta-filter for few-shot learning

【论文阅读】Learning dynamic alignment via meta-filter for few-shot learning

通过元滤波器学习动态对齐以实现小样本学习 引用&#xff1a;Xu C, Fu Y, Liu C, et al. Learning dynamic alignment via meta-filter for few-shot learning[C]//Proceedings of the IEEE/CVF conference on computer vision and pattern recognition. 2021: 5182-5191. 论文…
阅读更多...
软件崩溃？提示“由于找不到d3dx9_43.dll”是什么情况？如何有效解决d3dx9_43.dll丢失的方法分享

软件崩溃？提示“由于找不到d3dx9_43.dll”是什么情况？如何有效解决d3dx9_43.dll丢失的方法分享

d3dx9_43.dll错误是电脑经常出现的情况&#xff1f;那么出现“由于找不到d3dx9_43.dll”错误的问题是什么原因导致的呢&#xff1f;同时又有什么办法可以将错误提示“由于找不到d3dx9_43.dll”的问题进行解决呢&#xff1f; d3dx9_43.dll文件缺失是什么情况&#xff1f; d3dx9…
阅读更多...
Latex中给公式加边框

Latex中给公式加边框

1、这里使用的不是 amsmath 的 \boxed 命令, 而是 empheq 的 empheq 环境以及 xcolor 的 \fcolorbox 命令, 下面是代码, 可以分别阅读这两个手册来获取更多的信息 \documentclass{article} \usepackage{xcolor} \usepackage{empheq} \usepackage{amsmath} \begin{document}\be…
阅读更多...
设计模式之原型模式(上机考试多套试，每人题目和答案乱序排列场景)

设计模式之原型模式(上机考试多套试，每人题目和答案乱序排列场景)

前言&#xff1a; 平常你也付出了很多的时间&#xff0c;但就是没有得到多少收益。就像有时候很多小伙伴问我&#xff0c;我是该怎么学一个我没接触过的内容。我的个人经验非常建议&#xff0c;先不要学太多理论性的内容&#xff0c;而是尝试实际操作下&#xff0c;把要学的内容…
阅读更多...
如何提高谷歌收录速度？

如何提高谷歌收录速度？

相信很多做外贸推广的朋友都遇到过这种情况&#xff1a;网站上线了&#xff0c;但新页面迟迟不被谷歌收录。即使你的内容很优秀&#xff0c;设计也很精美&#xff0c;如果谷歌爬虫抓不到页面&#xff0c;一切努力就白费了。这时候&#xff0c;GSI谷歌快速收录服务就成了“救命稻…
阅读更多...
C++builder中的人工智能（15）：C++高斯误差线性单元（GELU）

C++builder中的人工智能（15）：C++高斯误差线性单元（GELU）

在这篇文章中&#xff0c;我们将探索高斯误差线性单元&#xff08;GELU&#xff1a;Gaussian Error Linear Unit&#xff09;是什么&#xff0c;它是如何在人工神经网络&#xff08;ANN&#xff09;中工作的&#xff0c;以及GELU可以应用于哪些AI技术。通过学习C中的高斯误差线…
阅读更多...
Python | Leetcode Python题解之第552题学生出勤记录II

Python | Leetcode Python题解之第552题学生出勤记录II

题目&#xff1a; 题解&#xff1a; class Solution:def checkRecord(self, n: int) -> int:MOD 10**9 7mat [[1, 1, 0, 1, 0, 0],[1, 0, 1, 1, 0, 0],[1, 0, 0, 1, 0, 0],[0, 0, 0, 1, 1, 0],[0, 0, 0, 1, 0, 1],[0, 0, 0, 1, 0, 0],]def multiply(a: List[List[int]],…
阅读更多...
网页版五子棋——匹配模块（客户端开发）

网页版五子棋——匹配模块（客户端开发）

前一篇文章&#xff1a;网页版五子棋——用户模块&#xff08;客户端开发&#xff09;-CSDN博客 目录 前言 一、前后端交互接口设计 二、游戏大厅页面 1.页面代码编写 2.前后端交互代码编写 3.测试获取用户信息功能 结尾 前言 前面文章介绍完了五子棋项目用户模块的代码…
阅读更多...
【微服务】不同微服务之间用户信息的获取和传递方案

【微服务】不同微服务之间用户信息的获取和传递方案

如何才能在每个微服务中都拿到用户信息&#xff1f;如何在微服务之间传递用户信息&#xff1f; 文章目录 概述利用微服务网关做登录校验网关转微服务获取用户信息openFeign传递微服务之间的用户信息 概述 要在每个微服务中获取用户信息&#xff0c;可以采用以下几种方法&#…
阅读更多...
OpenEuler 下 Docker 安装、配置与测试实例

OpenEuler 下 Docker 安装、配置与测试实例

文章目录 前言1. 环境准备2. 下载 Docker3.配置服务文件4.配置加速器加速下载docker镜像5. 验证 Docker 安装 前言 Docker 安装大致分为包管理器安装、脚本安装、离线手动安装、容器编排工具安装、桌面版安装等&#xff0c;每种安装各有特点&#xff0c;但涉及知识面不少&…
阅读更多...
GK7205V500 GK7250V510 国科微 SOC芯片

GK7205V500 GK7250V510 国科微 SOC芯片

GK7205V500 芯片是国科推出的新一代高集成度、高画质、低码率、低功耗的 AI IP Camera SoC 芯 片。 芯片集成 ARM Cortex A7 处理器&#xff0c;支持专业的 ISP 图像处理单元&#xff0c;H.265/H.264 视频编码与神经网络 处理单元&#xff08;NPU&#xff09;&#xff0c…
阅读更多...
_浅谈单片机的gcc优化级别__以双音频信号发生器为例

_浅谈单片机的gcc优化级别__以双音频信号发生器为例

一、简介 gcc有多种优化级别&#xff0c;一般不选择的情况下&#xff0c;IDE默认是按照-Og或这-O2优化的。 以gcc编译器为例&#xff0c;浅谈一下优化级别&#xff0c;我们常见的优化一般是指gcc的-O2、-Og。除此之外&#xff0c;gcc还有-Os等一系列优化&#xff0c;链接器也有…
阅读更多...
qt QTreeWidgetItem详解

qt QTreeWidgetItem详解

1、概述 QTreeWidgetItem 是 Qt 框架中的一个类&#xff0c;专门用于在 QTreeWidget&#xff08;一个基于项的树形视图&#xff09;中表示单个节点&#xff08;或称为项&#xff09;。QTreeWidget 继承自 QAbstractItemView&#xff0c;而 QTreeWidgetItem 则作为树中的一个节…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023