प्रौद्योगिकी साझेदारी

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

Nuxt 3 इत्यस्मिन् प्रयोगं कुर्वन्तुv-data-table component, वयं पृष्ठं प्रति कूर्दितुं इच्छामः यदा कश्चन पङ्क्तिः अथवा कोष्ठकः क्लिक् भवति ।घटकस्य क्लिक् इवेण्ट् श्रुत्वा उपयोक्तुं शक्नुवन्तिuseRouterपृष्ठकूदं प्राप्तुं ।

<template>
  <v-data-table
    :headers="headers"
    :items="items"
    @click:row="handleRowClick"
  ></v-data-table>
</template>
 
<script setup>
import { useRouter } from 'vue-router';
 
const router = useRouter();
 
const headers = [
  { text: 'Name', value: 'name' },
  { text: 'Age', value: 'age' },
  // ... 
];
 
const items = [
  { name: 'John Doe1', age: 30, id: 1 },
  { name: 'Jane Smith2', age: 25, id: 2 },
  // ... 
];
 
// 处理行点击事件
function handleRowClick(item) {
  // 使用item.id或其他标识符来确定要跳转到的具体页面
  router.push(`/user/${item.id}`);
}
</script>

अस्मिन् उदाहरणे यदा सारणीयाः कापि पङ्क्तिः क्लिक् भवति तदाhandleRowClickफंक्शन् आहूय उपयुज्यते चuseRouterइत्यस्यpush नूतनपृष्ठं प्रति कूर्दितुं विधिः, अस्य पृष्ठस्य मार्गः गतिशीलरूपेण उपयोक्तृ-ID द्वारा उत्पद्यते ।भवद्भिः सुनिश्चितं कर्तव्यं यत् प्रत्येकस्य उपयोक्तुः ID अद्वितीयः अस्ति यत् सम्यक् तत्सम्बद्धविवरणपृष्ठं प्रति कूर्दितुं शक्नोति