$ ref typecast заставляет компилятор требовать точку с запятой для завершения строки - PullRequest
Новая
       25

$ ref typecast заставляет компилятор требовать точку с запятой для завершения строки

0 голосов
/ 18 июня 2019

У меня есть компонент Vue, который использует модальный компонент vue-boostrap, с определением, которое выглядит примерно так: 

<template>
    <div>
        <b-modal ref="NewProjectDialog" id="NewProjectDialog" centered>
        </b-modal>
    </div>
</template>

<script lang="ts">
    import { Component, Vue, Prop } from 'vue-property-decorator'
    import {BModal} from 'bootstrap-vue'

    @Component()
    export default class Projects extends Vue {
        save_project() {
            (this.$refs['NewProjectDialog'] as BModal).hide()
        }
    }

Приведенный выше код работает правильно, однако, похоже, что я произвел приведение $ref['NewProjectDialog'], это ошибка, потому что кажется, что компилятор выбирает предыдущую строку как часть выражения, например, следующий код генерирует ошибку "Cannot invoke an expression whose type lacks a call signature.": 

save_project() {
    console.log('any code line without a semicolon fails')
    (this.$refs['NewProjectDialog'] as BModal).hide()
}

но следующий код компилируется нормально: 

save_project() {
    console.log('any code line without a semicolon fails');
    (this.$refs['NewProjectDialog'] as BModal).hide()
}

Может кто-нибудь объяснить, почему мне нужен разделитель строк для кода для правильной работы?

Ответы [ 2 ]

2 голосов
/ 18 июня 2019

Точка с запятой необходима здесь, чтобы устранить неоднозначность в синтаксисе.

Проблема заключается не только в том, что вы выполняете приведение, но в том, что приведение необходимо заключить в скобки.

Вероятно, легче понять, если мы уберем другие части кода и просто посмотрим на синтаксис: 

foo()
(bar).fizz()
// vs
foo();
(bar).fixx

Выглядит так же, но для интерпретатора первая выглядит как 

foo()(bar).fizz()

то есть вы вызываете результат foo() как функцию.

Если мы определяем наши переменные по-разному, этот синтаксис имеет большой смысл: 

function foo() {
    return a => a*2;
}
var bar = 2;

foo()
(bar).toFixed(2);
// Prints 4.00

Добавлениеточка с запятой сообщает интерпретатору, что foo() - это отдельный вызов, и следующая строка не работает с его результатом как функция.

0 голосов
/ 18 июня 2019

BootstrapVue v2.0.0-rc.21 (и новее) имеет более простой способ показа и скрытия модалов: 

this.$bvModal.hide('id-of-modal')
this.$bvModal.show('id-of-modal')

Выше этого. $ BvModal имеет объявления типов, поэтому он должен работать без приведения.

...