小编Mau*_*ski的帖子

我目前在组件的方法对象中有这段代码：

startImageAnimation() {
    $('.splash-image').fadeIn(1400, () => {
        setTimeout(function() {
            $('.splash-image').fadeOut(1400, () => {
                setTimeout(() => {
                    $('.splash-screen').fadeOut(600);
                });
            });
        }, 1000);
    });
},

我真的试图使用 Vue 转换找到一种方法，但是对于使用 jQuery 做这么简单的事情来说，它看起来太难了。

这里真正的问题是：我应该仍然像这样编码还是应该在这些情况下采取不同的方法？对于 jQuery animate() 或任何其他方法，jQuery 比纯 JS 更容易做到的事情也是如此。

谢谢！

我正在学习Vue.js,我很难找到一种方法来组织我的代码.我正在努力使所有内容尽可能模块化,因此在制作滑块时我会执行以下操作:

<template>
    <div class="banners">
        <slot></slot>
    </div>
</template>
<script>
    export default {
        methods: {
            echo() {
                console.log('Echoing..')
            }
        },
        mounted() {
            $('.banners').slick();
        }
    }
</script>

在我看来,我只是使用组件:

<banners>
    <?php for ($i = 0; $i < 5; $i++) : ?>
        <img src="http://lorempixel.com/1440/500" alt="Banner image" class="banner">
        <a href="#" v-on:click="echo">Echo</a>
    <?php endfor; ?>
</banners>

但是在我尝试调用echo之后,它会在父作用域中查找它,而不是在横幅组件作用域中查找它,并且表示该方法未定义.

我想知道实现这个的最佳方法.对我来说,在父作用域内声明方法是没用的,因为我将在整个项目中有数百万个其他类似于这种情况的方法,如果我这样做,它将很快变得无组织.我希望在他们自己的内容中使用这些横幅方法,这样我就可以轻松找到它们的所有位置,以及除横幅之外的其他模块.

也许我正在以错误的方式使用组件而不应该使用它？我只是不能在父作用域内放置一个echo()方法,仅用于与该特定组件相关的内容.想象一下,也许我会在其他元素中有其他的echo(),它会做一些不同于横幅的东西.

我也无法移动模板中的插槽内容,因为我需要通过PHP获取数据,这就是我在插槽中执行for的原因.

谢谢您的帮助!

我有一个与此类似的对象类型：

type Fields = {
  countryCode: string;
  currency: string;
  otherFields: string;
};

我还有一个与此类似的只读数组：

// Type: readonly ["countryCode", "currency", "otherFields"]
const allowedFields = ["countryCode", "currency", "otherFields"] as const;

我希望能够根据Fields对象类型为此数组声明指定一个接口，以便对其进行任何更改也需要更改数组。像这样的东西：

// How to create 'SomeType'?
const allowedFields: SomeType = ["countryCode"] as const; // Should throw error because there are missing fields

const allowedFields: SomeType = ["extraField"] as const; // Should throw error because "extraField" is not in the object type 'Fields'