在跳轉(zhuǎn)前的頁面使用 state 參數(shù)

<template>

<div class="modify-button">

<el-table :data="dish_data" style="width: 100%">

? ? <el-table-column align="center" label="操作" min-width="100">

? ? ? ? ? ? <template #default="scope">

? ? ? ? ? ? ? ? ? ? <el-button size="small" type="primary" @click="Edit(scope.row)">編輯</el-button>

? ? ? ? ? ? </template>

? ? </el-table-column>

</el-table>

</div>

</template>

<script setup lang="ts">

import { reactive, toRefs, onMounted, getCurrentInstance, ref } from 'vue'

import { ElMessageBox } from 'element-plus'

import { useRouter } from 'vue-router'

import {getObtaindishes} from '@/api/index'

const { proxy } = getCurrentInstance() as any

const router = useRouter()

const oper_data = reactive({

? ? page: 0,

? ? dish_data: [],

? ? total: 0

})

const {page,dish_data,total} = toRefs(oper_data)

// 請(qǐng)求菜品數(shù)據(jù)

onMounted(() => {

? ? get_dishes()

})

async function get_dishes() {

? ? try {

? ? ? ? let query = {

? ? ? ? ? ? page: oper_data.page

? ? ? ? }

? ? ? ? const res = await getObtaindishes({params:query});

? ? ? ? oper_data.dish_data = res.data.result

? ? ? ? oper_data.total = res.data.total

? ? } catch (e) {

? ? ? ? console.log('error',e);

? ? ? ? new proxy.$tips('服務(wù)器發(fā)生錯(cuò)誤', 'error').mess_age()

? ? }

}

// 編輯商品

const Edit = (scope) => {

? ? const params = JSON.stringify(scope)

? ? router.push({name:'upload',state:{params}}) //注意：此處一定要用params

}

</script>

<style scoped="scoped"></style>

跳轉(zhuǎn)的后頁面接收

console.log('history.state', typeof history.state.params)

const etid_data = history.state.params

if (etid_data != undefined) {

? ? const value = JSON.parse(etid_data)

? ? const { category, name, unitprice, unit, image, _id } = value

? ? oper_data.id = _id,

? ? oper_data.catevalue = category,

? ? oper_data.name = name,

? ? oper_data.unitprice = unitprice,

? ? oper_data.compvalue = unit,

? ? oper_data.goodsimage = image

}