VUE3中axios参数传递

interface ILogicalStationNumber {
    LogicalStationNumber: any;
}

const param = reactive<ILogicalStationNumber>({
    LogicalStationNumber: '1',
});

const ConnectMITSUBISHIPLC = async () => {
    param.LogicalStationNumber = LogicalStationNumber;
    await axios.get(webapiAddr + `PLC_MITSUBISHI/Connect`, {  //params参数必写 , 如果没有可传参数，传{}以
        params: param
    }).then(function (response) {
        //console.log('SignalR GetConnectStatus ok');
        console.log(response);
    })
        .catch(function (error) {
            console.log(error);
        });
}

<template>
	<div class="container">
		<el-row :gutter="20">
			<el-col :span="2">
				<el-button type="primary" @click="getStatus">刷新状态
				</el-button>
			</el-col>
		</el-row>
	</div>
</template>

<script setup lang="ts" name="laser">
import { ref, reactive, onMounted, watch } from 'vue'
import * as signalR from '@microsoft/signalr'
import axios from 'axios'

import screenfull from 'screenfull'

let LogicalStationNumber = ref(1)
var connection;

const webapiAddr = localStorage.getItem("webapi") + "/";

const signalRIAddr = "http://" + window.location.hostname + ":8200/"

const Login = async () => {
	const signalRurl = `${webapiAddr}chatHub`
	connection = new signalR.HubConnectionBuilder()
		.withUrl(signalRurl) //这里一定要写指定的ip，否则报错，大坑搞了1天的时间
		.withAutomaticReconnect()
		.build();
	await connection.start().then(() => {
		console.log('conn success ' + signalRurl);
	}).catch(() => {
		console.log('conn fail')
	});
	console.log('signalR start ' + signalRurl)
	connection.on('ReceiveMessage', (user, message) => { //监听登录的信息，前后端要一致
		console.log('aaa')
		// <!-- console.log(Loginmsg)
		// msgContent.push(Loginmsg)
		// console.log(msgContent.value) -->
		console.log('aaa', user, message)

		let aa = JSON.parse(message);
		name.value = aa.result;
	});

	// 	signalBuild.start().then(() => {
	// 	console.log('conn');
	// }).catch(() => {
	// 	console.log('conn fail')
	// })

}

const SetFullScreen = () => {
	//screenfull.isEnabled  此方法返回布尔值，判断当前能不能进入全屏
	if (!screenfull.isEnabled) {
		return false
	}
	//screenfull.toggle 此方法是执行全屏化操作。如果已是全屏状态，则退出全屏
	screenfull.toggle()
}

const buttonType = (val: any) => {
	if (val == "0") {
		return "primary";
	} else if (val == "10") {
		return "success";
	} else {
		return "info";
	}
}

let PLCMITSUBISHIStatus = ref("ng");
let APISignalRStatus = ref("ng");
let LaserControlCardStatus = ref("ng");

const buttonColor = (val: any) => {
	let result = "";
	switch (val.toLowerCase()) {
		case "ok":
			result = "success";
			IsAnimation.value = 0;
			break;
		case "connect":
			result = "success";
			IsAnimation.value = 0;
			break;
		case "connected":
			result = "success";
			IsAnimation.value = 0;
			break;
		case "ng":
			result = "danger";
			IsAnimation.value = 1;
			break;
		case "connectng":
			result = "danger";
			IsAnimation.value = 1;
			break;
		default:
			result = "primary";
			IsAnimation.value = 1;
	}
	return result;
}

interface ILogicalStationNumber {
	LogicalStationNumber: any;
}

const param = reactive<ILogicalStationNumber>({
	LogicalStationNumber: '1',
});

const ConnectMITSUBISHIPLC = async () => {
	param.LogicalStationNumber = LogicalStationNumber;
	await axios.get(webapiAddr + `PLC_MITSUBISHI/Connect`, {  //params参数必写 , 如果没有可传参数，传{}以
		params: param
	}).then(function (response) {
		//console.log('SignalR GetConnectStatus ok');
		console.log(response);
	})
		.catch(function (error) {
			console.log(error);
		});
}

const getStatus = () => {
	GetMITSUBISHIPLCStatus();
	GetAPISignalRStatus();
	GetLaserControlCardStatus();
}

onMounted(() => {
	ConnectMITSUBISHIPLC();
	ConnectAPISignalR();
	Login();
	getStatus();
})
</script>
<style>

</style>