我的Vue之旅 11 Vuex 實現購物車

来源:https://www.cnblogs.com/linxiaoxu/archive/2022/11/24/16920688.html
-Advertisement-
Play Games

Vue CartView.vue script 數組的filter函數需要return顯式返回布爾值，該方法得到一個新數組。 使用Vuex store的modules方式，註意讀取狀態的方式 this.$store.state.cart.items 刷新頁面後state狀態還原，需要用session ...


Vue

image-20221124022602927

CartView.vue script

  • 數組的filter函數需要return顯式返回布爾值，該方法得到一個新數組。
  • 使用Vuex store的modules方式，註意讀取狀態的方式 this.$store.state.cart.items
  • 刷新頁面後state狀態還原，需要用session保存狀態（TODO）
  • axios 發出 get 請求，第二個參數對象的 params 欄位值顯式使用 JSON.stringify 進行轉化，如果不使用會表示成 xxx?items=xxx&items=xxx&items=xxx
<script lang="ts">
import { defineComponent } from "vue";

export default defineComponent({
  name: "CartView",
  components: {},
  methods: {
    deleteItem(id: number) {
      this.$store.dispatch("del", id);
      console.log(this.$store.state.cart.items);
      this.items = this.items.filter((item) => {
        return item.id != id; // @ return
      });
    },
  },
  data() {
    return {
      days: 29,
      hours: 8,
      minutes: 20,
      discount: 24,
      items: [
        {
          id: 201,
          img: "https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221123235723_201.png",
          name: "Family",
          price: 2.99,
          author: "Tim Sheinman",
          category: "Puzzle",
        }
      ],
    };
  },
  computed: {
    cost() {
      let total = 0;
      this.items.forEach((item) => {
        total += item.price;
      });
      total *= (100 - this.discount) / 100;
      const res = total.toFixed(2);
      return res;
    },
  },
  created() {
    this.axios
      .get("/game/query", {
        params: {
          items: JSON.stringify(this.$store.state.cart.items),
        },
      })
      .then((response) => {
        if (!response.data) {
          console.log("無數據");
          return;
        }
        this.items = [];
        response.data.forEach((item: any) => {
          this.items.push({
            id: item.id,
            img: item.img,
            name: item.title,
            price: item.price,
            author: item.author,
            category: item.category,
          });
        });
      })
      .catch((err) => {
        console.log(err);
      });
  },
});
</script>

CartView.vue template

<template>
  <div class="m-3">
    <div class="text-3xl font-bold text-stone-700">
      <b-icon-cart-check
        class="text-4xl inline-block align-text-top mr-2"
      ></b-icon-cart-check
      >My Cart
    </div>
    <div class="text-stone-600 mt-4">
      Buy everything for
      <span class="font-bold">${{ cost }}! </span>
      <span class="font-bold">Save {{ discount }}%!</span>
    </div>
    <div class="mt-4 border border-stone-300 rounded-sm">
      <div
        class="
          mx-2
          h-10
          text-center
          pt-2.5
          m-auto
          mt-2
          bg-rose-500
          font-bold
          text-white
          rounded
        "
      >
        Buy all for ${{ cost }}
      </div>
      <div class="mt-2 text-center text-stone-500 text-sm">offer ends in</div>
      <div class="text-center">
        <div class="inline-block m-1">
          <div>{{ days }}</div>
          <div class="text-xs text-stone-500">DAYS</div>
        </div>
        <div class="inline-block m-1">
          <div>{{ hours }}</div>
          <div class="text-xs text-stone-500">HOURS</div>
        </div>
        <div class="inline-block m-1">
          <div>{{ minutes }}</div>
          <div class="text-xs text-stone-500">MINUTES</div>
        </div>
      </div>
    </div>
    <div class="mt-4">
      <div>includes the following items:</div>
      <template v-for="(value, index) in items" :key="index">
        <div class="mt-3">
          <img class="inline-block h-28 rounded-md" :src="value.img" />
          <div class="inline-block ml-4">
            <div class="">
              <span class="font-bold">{{ value.name }}</span>
              <div
                class="
                  ml-2
                  inline-block
                  text-xs
                  bg-stone-500
                  rounded-sm
                  px-1
                  py-0.5
                  mt-1
                  text-center text-white
                "
              >
                ${{ value.price }}
              </div>
            </div>
            <div class="text-stone-500 text-sm">
              {{ value.author }}
            </div>
            <div class="text-stone-500 text-sm">
              {{ value.category }}
            </div>
            <b-icon-x-square
              @click="deleteItem(value.id)"
              class="text-3xl mt-2"
            ></b-icon-x-square>
          </div>
        </div>
      </template>
    </div>
  </div>
</template>

store/cart.ts

VUE裡面的export default 是什麼_啊了個嗚的博客-CSDN博客

const state = {
  items: [
    // 201, 202, 203, 204
  ]
}

const mutations = {
  add(state: any, param: number) {
    if (!state.items.includes(param)) {
      state.items.push(param)
    }
  },
  del(state: any, param: number) {
    if (state.items.indexOf(param) != -1) {
      state.items.splice(state.items.indexOf(param), 1)
    }
  }
}

const actions = {
  add(context: any, param: number) {  // 可以 {commit} 解構簡化
    context.commit('add', param)
  },
  del(context: any, param: number) { 
    context.commit('del', param)
  }
}

const cart = {
  state,
  mutations,
  actions
}

export default cart

store/index.ts

import { createStore } from 'vuex'
import cart from './cart'

export default createStore({
  modules: {
    cart: cart
  }
})

Property ‘$store‘ does not exist on type ‘CreateComponentPublicInstance

在src文件夾下新建文件夾vue.d.ts

// vuex.d.ts
import { ComponentCustomProperties } from '@/vue'
import { Store } from 'vuex'

declare module '@vue/runtime-core' {
  // declare your own store states
  interface State {
    cart
  }

  // provide typings for `this.$store`
  interface ComponentCustomProperties {
    $store: Store<State>
  }
}

三種方法實現Vue路由跳轉時自動定位在頁面頂部

image-20221124023109106 
// 跳轉後自動返回頁面頂部
router.afterEach(() => {window.scrollTo(0,0);
})


const router = new VueRouter({routes:[...],scrollBehavior () {// return返回期望滾動到的位置的坐標return { x: 0, y: 0 }}
})


router.beforeEach((to, from, next) => {    // chrome相容document.body.scrollTop = 0// firefox相容document.documentElement.scrollTop = 0// safari相容window.pageYOffset = 0next()
})

Golang Gin

structs/game.go

package structs

type Game struct {
	ID       int64   `db:"id" json:"id"`
	Title    string  `db:"title" json:"title"`
	Text     string  `db:"text" json:"text"`
	Img      string  `db:"img" json:"img"`
	Author   string  `db:"author" json:"author"`
	Category string  `db:"category" json:"category"`
	Price    float64 `db:"price" json:"price"`
}

controller/game.go

image-20221124022438383

package controller

import (
	"encoding/json"
	"fmt"

	"github.com/gin-gonic/gin"
	"wolflong.com/vue_gin/structs"
	"wolflong.com/vue_gin/variable"
)

func QueryGame(c *gin.Context) {
	db := variable.DB
	items_ := c.Query("items")
	var items []int64
	err := json.Unmarshal([]byte(items_), &items)
	if err != nil || len(items) == 0 {
		c.JSON(501, gin.H{
			"message": "failure items",
		})
		c.Abort()
		return
	}
	// fmt.Println(items)
	stmt := `select id,title,author,category,img,price from game where id in (`
	for i, v := range items {
		stmt += fmt.Sprintf("%d", v)
		if i != len(items)-1 {
			stmt += ","
		}
	}
	stmt += ")"
	rows, err := db.Query(stmt)
	checkError(err)
	defer rows.Close()
	var res []structs.Game
	for rows.Next() {
		var c structs.Game
		err = rows.Scan(&c.ID, &c.Title, &c.Author, &c.Category, &c.Img, &c.Price)
		checkError(err)
		res = append(res, c)
	}
	c.JSON(200, res)
}

router/router.go

新增路由

game := r.Group("/game")
{
    game.GET("/query", controller.QueryGame)
}

Mysql 建表

DROP DATABASE VUE;
create database if not exists vue;
use vue;

CREATE TABLE gameblog (
  id INT PRIMARY KEY AUTO_INCREMENT,
  title VARCHAR(255),
  text VARCHAR(255),
  img VARCHAR(255)
);

insert into gameblog(title,text,img) values 
("Games of the Month: surrealist solitaire puzzles","What’s that? You need more games? I hear you, anonymous hapi fan.We’ve reached the part of the year when games start coming out fast","https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221102184434_1.jpg"),
("Games of the Month: Puzzles!","Sometimes you need a good puzzle game, just something to throw all of your attention at and ignore anything else going on. Well if that sometime for you is right now, then you’re in luck because in this Games of the Month","https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221102184434_2.jpg"),
("The next hapi Creator Day is July 29th!","I don’t think I’m allowed to make the entire body of this post “Thenext itch.io Creator Day is taking place on Friday July 29th.” I mean it’s true, we are hosting the next itch.io Creator Day on Friday July 29th but I should probably write more here.","https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221102184434_3.jpg");

select * from gameblog;

drop table if exists game;
CREATE TABLE game (
  id INT PRIMARY KEY AUTO_INCREMENT,
  title VARCHAR(255),
  text VARCHAR(255),
  img VARCHAR(255),
  author VARCHAR(255) default "", # TODO ID
  category VARCHAR(255) default "", # TODO ID
  price decimal(6,2) default 0,
  web boolean default 0
  # TODO 發佈時間
  # TODO 瀏覽量
  # TODO 評論量
  # TODO 熱度綜合指標
);

CREATE TABLE tag (
  id INT PRIMARY KEY AUTO_INCREMENT,
  title VARCHAR(255)
);

CREATE TABLE gametag (
  gameid INT,
  tagid INT
);
# TODO 外鍵

insert into game(id,title,author,category,text,img,price,web) values
(1,"Late Night Mop","","","A haunted house cleaning simulator.","https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221102193135_1.png",0,0),
(2,"an average day at the cat cafe","A haunted house cleaning simulator.","","","https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221102193135_2.png",0,1),
(3,"Corebreaker","A fast-paced action-platform shooter game with roguelike elements.","","","https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221102193135_3.png",19.99,0),
(4,"Atuel","Traverse a surrealist landscape inspired by the Atuel River in Argentina.","","","https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221102193135_5.png",0,0),
(201,"Family","Tim Sheinman","Puzzle","TEST","https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221123235723_201.png",2.99,0),
(202,"Rivals","dreamfeel","Puzzle","TEST","https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221123235723_202.png",5.99,0),
(203,"Conspiracy!","Tim Sheinman","Puzzle","TEST","https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221123235723_203.png",4.99,0),
(204,"Riley & Rochelle","Nolski","Puzzle","TEST","https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221123235723_204.png",14.99,0)
;
select * from game;


insert into tag values
(1,"Difficult"),
(2,"Fast-Paced");

insert into gametag values
(3,1),
(3,2),
(4,1);

DELIMITER $$
CREATE PROCEDURE gamelist()
BEGIN
	# TODO
END $$
DELIMITER ;

select a.title,a.text,img,price,web,if(group_concat(c.title separator "#") is null ,"", group_concat(c.title separator "#")) as tag from game a left join gametag b on a.id = b.gameid left join tag c on b.tagid = c.id group by a.id;


drop table if exists users;
drop table if exists comments;

create table users(
id int primary key auto_increment,
uid varchar(255),
name varchar(255),
password varchar(255)
);

create table comments(
id int primary key auto_increment,
uid int,
text mediumtext,
pid int,
date long
);

insert into users(uid,name,password) values
("1001","admin","123456"),
("1002","玉米燉蘿蔔","123456"),
("1003","西紅柿炒番茄","123456");

INSERT INTO comments(id, uid, text, pid, date) VALUES (1, 1003, 'asdmoapsdasopdnopasdopasopdas localstorage', 100, 1666107328334);
INSERT INTO comments(id, uid, text, pid, date) VALUES (2, 1003, 'asdmoapsdasopdnopasdopasopdas localstorage', 100, 1666107328836);
INSERT INTO comments(id, uid, text, pid, date)  VALUES (3, 1003, 'asdmoapsdasopdnopasdopasopdas localstorage', 100, 1666107329459);
INSERT INTO comments(id, uid, text, pid, date)  VALUES (4, 1001, 'asdmoapsdasopdnopasdopasopdas localstorage', 100, 1666107331864);
INSERT INTO comments(id, uid, text, pid, date)  VALUES (5, 1001, 'asdmoapsdasopdnopasdopasopdas localstorage', 100, 1666107332720);
INSERT INTO comments(id, uid, text, pid, date)  VALUES (6, 1002, '你好', 100, 1666107337646);

select * from users;
select * from comments;
select * from game;

drop table if exists posts;
create table posts(
id int primary key auto_increment,
bgcolor varchar(7),
textcolor varchar(7),
headimg varchar(255),
videosrc varchar(255),
imgs mediumtext,
html mediumtext
);

insert into posts(id,bgcolor,textcolor,headimg,videosrc,imgs,html) values
(
100,
"#E8E1BC",
"#2f5b71",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221109232741_head.png",
"https://www.youtube.com/embed/zGGTLStyKX0",
'["https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221109233251_1.png",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221109233256_4.png",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221109233253_2.png",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221109233255_3.png",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221109233258_5.png"]
',
'<div class="m-4 text-xl font-bold">
      A sound reverberated from beyond the ocean.
    </div>
    <div class="ml-4 mt-6">
      At the edge of a desolate island, pick up what the waves wash ashore to
      make instruments. Use those instruments to answer the echoes heard from
      beyond the ocean. In this hand-drawn world, enjoy a soothing soundscape
      formed by waves, footsteps and the sounds made from things washed up.
    </div>
    <img
      src="https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221109231919_play.gif"
      class="w-full mt-6 px-4"
    />
    <div class="ml-4 mt-6">
      Resonance of the Ocean is a short adventure game you can play in 10 ~
      30min. This game was made in the 22nd unity1week, a Japanese game jam
      event. This version is updated with an English localization and with small
      changes. In unity1week, this game placed 4th in the overall ranking, and
      1st for art and sound.
    </div>
    <div class="m-4 mt-6 text-xl font-bold">Controls</div>
    <div class="ml-4 mt-6">
      This game only supports keyboard controls.
      <ul class="list-disc ml-6 mt-2">
        <li>Arrow Keys: Move</li>
        <li>Space Key（Or ZXC）: Confirm</li>
        <li>ZXC Keys: pick up, replace, throw, search</li>
      </ul>
    </div>
    <div class="m-4 mt-6 text-xl font-bold">Save Function</div>
    <div class="ml-4 mt-6">
      There is no save function available as the time required to complete the
      game is short (10 ~ 30 min). Thank you for your understanding.
    </div>'
),
(
101,
"#FFFFFF",
"#000000",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004301_head2.png",
"https://www.youtube.com/embed/vddlEmrbNRw",
'["https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_7.png",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_8.png",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_9.png",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_10.png"]
',
'
<div class="ml-4 mt-6">
      The past and future cannot be explored alone! Team up with a friend and
      piece together the mysteries surrounding Albert Vanderboom. Communicate
      what you see around you to help one another solve various puzzles and
      explore the worlds from different perspectives!
    </div>
    <div class="ml-4 mt-6">
      The Past Within is the first <a class="underline">co-op</a> only
      point-and-click adventure set in the mysterious world of Rusty Lake.
    </div>
    <div class="m-4 mt-6 text-xl font-bold">Features</div>
    <div class="ml-4 mt-6">
      <ul class="list-disc ml-6 mt-2">
        <li class="font-bold">A co-op experience</li>
        Play together with a friend, one in The Past, the other in The Future.
        Work together to solve the puzzles and help Rose set her father’s plan
        in motion!
        <li class="font-bold">Two worlds - Two perspectives</li>
        Both players will experience their environments in two different
        dimensions: 2D as well as in 3D - a first-time experience in the Rusty
        Lake universe!
        <li class="font-bold">Cross-platform play</li>
        As long as you can communicate with each other, you and your partner of
        choice can each play The Past Within on your preferred platform: PC,
        Mac, iOS, Android and (very soon) Nintendo Switch!
        <li class="font-bold">Playtime & Replayability</li>
        The game contains 2 chapters and has an average play-time of 2 hours.
        For the full experience, we recommend replaying the game from the other
        perspective. Plus you can use our replayability feature for a fresh
        start with new solutions to all puzzles.
      </ul>
    </div>
    '
),
(
201,
"#FFFFFF",
"#000000",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221123235723_201.png",
"https://www.youtube.com/embed/vddlEmrbNRw",
'["https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_7.png",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_8.png",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_9.png",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_10.png"]
',
'
<div class="ml-4 mt-6">
	測試測試測試
    </div>
    '
),
(
202,
"#FFFFFF",
"#000000",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221123235723_202.png",
"https://www.youtube.com/embed/vddlEmrbNRw",
'["https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_7.png",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_8.png",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_9.png",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_10.png"]
',
'
<div class="ml-4 mt-6">
	測試測試測試
    </div>
    '
),
(
203,
"#FFFFFF",
"#000000",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221123235723_203.png",
"https://www.youtube.com/embed/vddlEmrbNRw",
'["https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_7.png",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_8.png",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_9.png",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_10.png"]
',
'
<div class="ml-4 mt-6">
	測試測試測試
    </div>
    '
),
(
204,
"#FFFFFF",
"#000000",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221123235723_204.png",
"https://www.youtube.com/embed/vddlEmrbNRw",
'["https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_7.png",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_8.png",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_9.png",
"https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_10.png"]
',
'
<div class="ml-4 mt-6">
	測試測試測試
    </div>
    '
)
;

select * from posts;

drop table if exists sellopts;
create table sellopts(
	id int primary key auto_increment,
	days int,
    hours int,
    minutes int,
    discount int
);
insert into sellopts(id,days,hours,minutes,discount) values
(1,29,8,20,24);


select id,bgcolor,textcolor,headimg,videosrc,imgs,html from posts where id = 100

JS 數組方法

JavaScript Array 對象 | 菜鳥教程 (runoob.com)

Gin Query

Gin之獲取querystring參數_GoGo在努力的博客-CSDN博客

Gin Session

gin-contrib/sessions: Gin middleware for session management (github.com)

gin-contrib/sessions 筆記 | PJCHENder 未整理筆記


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 配置文件 資料庫存儲引擎 嚴格模式 MySQL欄位基本數據類型
    字元編碼與配置文件 \s查看MySQL相關信息 相關信息有：當前用戶、版本、編碼、埠號 MySQL5.6及之前的版本編碼需要人為統一 之後的版本已經全部預設統一 如果想要永久修改編碼配置 需要操作配置文件my-default.ini 註意事項： mysql預設埠號3306 當重覆起mysql服務 ...
  • openGauss DB4AI框架揭秘
    前幾天，Gartner 發佈了企業機構在2023年需要探索的十大戰略技術趨勢。 Gartner 傑出研究副總裁 Frances Karamouzis 表示：“為了在經濟動蕩時期增加企業機構的盈利，首席信息官和IT高管必須在繼續加快數字化轉型的同時，將目光從節約成本轉向新的卓越運營方式。Gartner ...
  • 開源共建 | 中國移動馮江濤：ChunJun（原FlinkX）在數據入湖中的應用
    ChunJun（原FlinkX）是一個基於 Flink 提供易用、穩定、高效的批流統一的數據集成工具。2018年4月，秉承著開源共用的理念，數棧技術團隊在github上開源了FlinkX，承蒙各位開發者的合作共建，FlinkX得到了快速發展。 兩年後的2022年4月，技術團隊決定對FlinkX進行整 ...
  • Oracle中ALTER TABLE的五種用法（二）
    首發微信公眾號：SQL資料庫運維 原文鏈接：https://mp.weixin.qq.com/s?__biz=MzI1NTQyNzg3MQ==&mid=2247485212&idx=1&sn=450e9e94fa709b5eeff0de371c62072b&chksm=ea37536cdd40da7 ...
  • Python基礎之資料庫：3、SQL與NoSQL、資料庫重要概念、SQL的基本語句
    一、SQL與NoSQL ​ 資料庫服務端可以服務多種類型的客戶端 ​ 客戶端可以是自己開發的，也可以是python代碼編寫的，也可以是其他編程語言編寫的 SQL 操作關係型數據的語言 NoSQL 操作非關係型數據的語言 須知: ​ 1、SQL有時又也指代關係型資料庫 ​ 2、NoSQL有時候也指代非 ...
  • Android網路請求(終) 網路請求框架Retrofit
    Android網路請求(終) 網路請求框架Retrofit Retrofit底層是由OkHttp封裝的，Retrofit對於註解的使用十分頻繁，所以不瞭解註解的同學們可以去查查資料什麼的。 這裡有一個小細節，要使用Retrofit至少需要jdk1.8以上和Android API 21以上 Andro ...
  • Android網路請求(4) 網路請求框架Volley
    Android網路請求(4) 網路請求框架Volley Volley是Google在2013年5月15日到17日在舊金山Moscone中心舉辦網路開發者年會中推出的Android非同步網路載入框架和圖片載入框架，它特別適合數據體量小且通訊頻繁的網路操作場景，而Android開發中大多數場景都是這樣的， ...
  • AI賦能音樂創作，人人都是音視頻創作者
    華為HMS Core音頻編輯服務（Audio Editor Kit）依托自身AI技術的研發優勢，上線全新的歌聲合成音色及伴奏，給音視頻創作者提供更多的創作可能。在短視頻場景中，用戶自定義歌詞的歌聲結合視頻讓用戶感受到身臨其境，自由表達自己的情緒；在虛擬偶像場景中，歌聲合成功能賦予虛擬歌手們演唱風格各 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發（一）：使用.NET MAUI開發第一個安卓APP
    移動開發（一）：使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說，近來想嘗試開發一款安卓APP，考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP，畢竟是使用Visual Studio開發工具，使用起來也比較的順手，結合微軟官方的教程進行了安卓 ...
  • wpf ToggleButton選中效果和一個登錄界面
    前言 QuestPDF 是一個開源 .NET 庫，用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫，它徹底改變了我們生成 PDF 文檔的方 ...
  • 彈幕樹洞項目功能新增篇
    項目地址 項目後端地址： https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址： ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址： http://tree ...
  • 第27篇 sqlserver2022詳細安裝步驟
    話不多說，直接開乾 一.下載 1.官方鏈接下載： https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe，運行開始下載SQL server； 二. ...
  • .NET 開源高性能 MQTT 類庫
    前言 隨著物聯網（IoT）技術的迅猛發展，MQTT（消息隊列遙測傳輸）協議憑藉其輕量級和高效性，已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫，為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog文檔翻譯系列（六） - 可用的接收器、增強器、格式化輸出
    Serilog支持多種接收器用於日誌存儲，增強器用於添加屬性，LogContext管理動態屬性，支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項，適用於不同需求。 ...
  • 警惕 Visual Studio 屬性求值副作用導致邏輯不符合預期
    目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據，爬取信息時需要模擬瀏覽器行為，否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下： 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • [使用目前最新版]HybridCLR6.9.0+YooAsset2.2.4實現純C# Unity熱更新方案 (一)
    1.前言 什麼是熱更新 游戲或者軟體更新時，無需重新下載客戶端進行安裝，而是在應用程式啟動的情況下，在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR，Xlua，ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles，Addressable， ...
  • 在 ASP.NET Core Web API 中使用操作篩選器統一處理通用操作
    本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺，其實像阿裡雲，騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後，它會送 ...
  • 第28篇 如何.net中實現高效可靠數據同步api
    通過以下方式可以高效，並保證數據同步的可靠性 1.API設計 使用RESTful設計，確保API端點明確，並使用適當的HTTP方法（如POST用於創建，PUT用於更新）。 設計清晰的請求和響應模型，以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證，確保接收到的數據符合預期格 ...
所有分類