# shuiwu

**Repository Path**: beta_zhao/shuiwu

## Basic Information

- **Project Name**: shuiwu
- **Description**: 水务
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-02-11
- **Last Updated**: 2025-12-18

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Vue 3 + TypeScript + Vite

This template should help get you started developing with Vue 3 and TypeScript in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.

## Recommended IDE Setup

- [VS Code](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).

## Type Support For `.vue` Imports in TS

TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin) to make the TypeScript language service aware of `.vue` types.

If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a [Take Over Mode](https://github.com/johnsoncodehk/volar/discussions/471#discussioncomment-1361669) that is more performant. You can enable it by the following steps:

1. Disable the built-in TypeScript Extension
   1. Run `Extensions: Show Built-in Extensions` from VSCode's command palette
   2. Find `TypeScript and JavaScript Language Features`, right click and select `Disable (Workspace)`
2. Reload the VSCode window by running `Developer: Reload Window` from the command palette.


复制项目=====
修改项目======    positialSet.vue页面

const mapview=ref<InstanceType<typeof MapView>>()


// store.js
import { defineStore } from 'pinia'

// defineStore 调用后返回一个函数，调用该函数获得 Store 实体
import { defineStore } from "pinia";
import { Names } from "./store-name";
//定义的defineStore()，并且它需要一个唯一的名称，Names.Test名称抽离出去作为第一个参数传递
export const useTestStore = defineStore(Names.Test, {
    state: () => ({ current: 1, name: '小满' }),
    //computed：修饰一些值
    getters: {

    },
    //methods:可以做同步异步，提交state
    actions: {
        setCurrent(type: boolean) {
            //通过this指向属性
            if (!type) return false
            this.current++
        }
    }
})

// 在vue3中使用
<template>
  <div>
    pinia:{{ current }}---{{ Test.name }}
    <button @click="setCur">set</button>
  </div>
</template>
<script lang="ts" setup>
import { useTestStore } from './store';

const Test = useTestStore()
const current = computed(() => Test.current)
/**
 * state的五种方式修改值
    1.直接修改值
        Test.current=2
    2.通过$patch修改,支持单个或多个属性修改
        Test.$patch({current:33})
    3.$patch工厂函数方式
        Test.$patch((state) => {
          state.current = 99;
          state.name = '范迪塞尔'
        })
    4.$state 缺点是必须修改整个对象
        Test.$state = { current: 88, name: '123' }
    5.action
        Test.setCurrent()
 */
const setCur = () => {
  // Test.current = 2
  // Test.$patch({ current: 33 })
  Test.$patch((state) => {
    state.current = 99;
    state.name = '范迪塞尔'
  })
  Test.$state = { current: 88, name: '123' }
  Test.setCurrent(true)
}
</script>

<style lang = "scss" scoped>
</style>

打包说明：
1、接口地址更改
2、mqtt地址更改



0.1g: {damage: "376", intact: "0"}

0.2g: {damage: "376", intact: "0"}

0.3g: {damage: "376", intact: "0"}