-1

Nativescript 和 Vue 非常新，所以请原谅我半生不熟的问题。

我正在尝试构建一个小应用程序，其中我有一个图像标签和一个按钮，按下按钮时，图像应该显示，我希望这个图像源作为变量传递，但是在按下按钮时，我的应用程序崩溃了，我正在 nativescript 操场上写这个。

这是代码：

<template>
    <Page class="page">
        <ActionBar title="Home" class="action-bar" />
        <ScrollView>
            <StackLayout class="home-panel">

                <Image src="{{img_src}}" @tap="onImgTap" />
                <Button text="Button" @tap="onButtonTap" />
            </StackLayout>
        </ScrollView>
    </Page>
</template>

<script>
     const imageSourceModule = require("tns-core-modules/image-source");
     const imageSourceModule = require("tns-core-modules/image-source");
     const fileSystemModule = require("tns-core-modules/file-system");
    export default {

    methods: {
        onButtonTap() {
            console.log("Button was pressed");
             img_src:native_img
        },
        onImgTap(){
            alert("Dont press image !");

        }
    },

    data() {
        return {
            native_img:"https://play.nativescript.org/dist/assets/img/NativeScript_logo.png"
        };
    },

}

</script>

<style scoped>
    .home-panel {
        vertical-align: center;
        font-size: 20;
        margin: 15;
    }

    .description-label {
        margin-bottom: 15;
    }
</style>

非常感谢任何帮助。！

问候，~哈利

4

1 回答 1

1

您的应用程序崩溃，因为您为变量分配值img_src:native_img不正确。它应该是，

onButtonTap() {
   console.log("Button was pressed");
   this.img_src=native_img;
}

同样在数据中需要定义img_src:"" 

data() {
return {
 native_img:"https://play.nativescript.org/dist/assets/img/NativeScript_logo.png",
 img_src:""
     };
}

同样在 Html 中， src={{img_src}} 到 :src=img_src

<Image :src="img_src" @tap="onImgTap" />
于 2018-08-18T19:58:23.197 回答