Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Is ListView supported in 3.0.0-beta? #1047

Open
@mreall

Description

@mreall

I followed the instructions to create a new nativescript-vue 3 app. Then I added a basic ListView to the Home page. However, it won't render. Instead I get a lot of warning messages that say the following:

Vue warn]: Failed to resolve component: v-templateIf this is a native custom element, make sure to exclude it from component resolutionvia compilerOptions.isCustomElement.at <Home>

I'm running the app on an iOS simulator. Is ListView supported or is there something else I need to do to get it to work?

package.json.

{  "name": "example-app-vue3",  "main": "src/app.ts",  "version": "1.0.0",  "private": true,  "dependencies": {    "@nativescript/core": "~8.5.0",    "nativescript-vue": "3.0.0-beta.7"  },  "devDependencies": {    "@nativescript/ios": "8.5.1",    "@nativescript/tailwind": "^2.0.1",    "@nativescript/types": "~8.5.0",    "@nativescript/webpack": "~5.0.0",    "@types/node": "~17.0.21",    "tailwindcss": "^3.1.8",    "typescript": "~4.9.5"  }}

Home.vue

<template>  <Frame>    <Page>      <ActionBar>        <Label text="Home" />      </ActionBar>      <GridLayout rows="20, auto, auto, *">        <Label row="1" :text="message" @tap="logMessage" />        <Button row="2" @tap="$navigateTo(Details)"          horizontalAlignment="center">          View Details        </Button>        <ListView row="3" for="location in tmpLocations">          <v-template>            <Label :text="location.name"></Label>          </v-template>        </ListView>      </GridLayout>    </Page>  </Frame></template><script lang="ts" setup>import {  ref,  computed,  onMounted,  onUnmounted,  $navigateTo,} from 'nativescript-vue';import Details from './Details.vue';const counter = ref(0);const message = computed(() => {  return `Blank {N}-Vue app: ${counter.value}`;});const tmpLocations = computed(() => {  let locations = [];  for (let i = 0; i < 5; i++) {    locations.push({      name: `location ${i}`,    });  }  console.log(`Home/tmpLocations, locations`, locations);  return locations;});function logMessage() {  console.log('You have tapped the message!');}let interval: any;onMounted(() => {  console.log('mounted');  interval = setInterval(() => counter.value++, 100);});onUnmounted(() => {  console.log('unmounted');  clearInterval(interval);});</script><style>/* .info {    font-size: 20;  } */</style>

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions


      [8]ページ先頭

      ©2009-2025 Movatter.jp