小编mst*_*std的帖子

在具有相当大选项列表的选择输入的 vuejs2 应用程序中，它破坏了我在超小型设备上的页面设计。在网络中搜索我发现 \xe2\x80\x9csize\xe2\x80\x9d 属性，但这不是我\n我需要的：我想要下拉选择，这是默认的。\n还有其他决定吗，也许是用CSS设置下拉选择区域的最大高度。

修改后的第 1 部分： \n我在http://photographers.my-demo-apps.tk/sel_test上制作了测试演示页面\nit 有 2 个具有自定义设计和事件的选择输入，如本示例链接所示\n如何设置高度选择框的下拉菜单\n以及js fiddle中的以下解决方法：

select{\n    color: red;\n}

<select onfocus=\'this.size=10;\' onblur=\'this.size=1;\' onchange=\'this.size=1; this.blur();\'>\n  <option>1</option>\n  <option>2</option>\n  <option>3</option>\n  <option>4</option>\n  <option>5</option>\n  <option>6</option>\n  <option>7</option>\n  <option>8</option>\n  <option>9</option>\n  <option>10</option>\n  <option>11</option>\n  <option>12</option>\n  <option>13</option>\n  <option>14</option>\n  <option>15</option>\n  <option>16</option>\n  <option>17</option>\n  <option>18</option>\n  <option>19</option>\n  <option>20</option>\n  <option>21</option>\n</select>\n<div>Popular Tags:</div>

\n

应用于第二个选择输入，它看起来/工作不正常。\n我想它与当前设计有某种冲突。\n它可以以某种方式修复吗？

因为那是 vuejs2 页面，我知道在https://github.com/vuejs/awesome-vue#select有一些选择组件，我使用了其中的一些组件，例如 vue-select 但我需要保留自定义设计所以我尝试使用原始的选择输入...

修改第 2 部分： \n我添加了 2 个类定义：

.select-wrapper {\n    height: 50px !important;\n    overflow-y: …

在我的laravel 5.8 / vue 2.5.17 / vuex ^ 3.1.0中，我遇到一个问题，即打开对话框时会发生事件重复。我有一个用于项目删除的事件：

在我的Vue文件中：

...

mounted() {

    bus.$on('dialog_confirmed', (paramsArray) => {
        if (paramsArray.key == this.deleteFromUserListsKey(paramsArray.user_list_id)) {
            this.runDeleteFromUserLists(paramsArray.user_list_id, paramsArray.index);
        }
    })
    bus.$on('onUserListDeleteSuccess', (response) => {
        this.is_page_updating = false
        this.showPopupMessage("User lists", 'User\'s list was successfully deleted!', 'success');
    })

    bus.$on('onUserListDeleteFailure', (error) => {
        this.$setLaravelValidationErrorsFromResponse(error.message);
        this.is_page_updating = false
        this.showRunTimeError(error, this);
        this.showPopupMessage("User lists", 'Error adding user\'s list !', 'error');
    })


}, // mounted() {

methods: {
    confirmDeleteUserList(user_list_id, user_list_title, index) {
        this.confirmMsg("Do you want to exclude '" + user_list_title + …

当我在这里阅读时，我尝试升级我的 laravel 8 https://laravel.com/docs/9.x/upgrade

但是当我在composer.json中applyid一些更改后，我得到了错误：

 $ composer update
 Loading composer repositories with package information
 Updating dependencies
 Your requirements could not be resolved to an installable set of packages.
 Problem 1
    - illuminate/support[v5.8.0, ..., 5.8.x-dev] require php ^7.1.3 -> your php version (8.1.2) does not satisfy that requirement.
    - illuminate/support[v6.0.0, ..., v6.19.1] require php ^7.2 -> your php version (8.1.2) does not satisfy that requirement.
    - illuminate/support[v7.0.0, ..., v7.28.4] require php ^7.2.5 -> your php version (8.1.2) does not satisfy that …

在我的 laravel 7 /livewire 1.3 / alpinejs 2 项目中，我从https://flatpickr.js.org datepicker 添加了 flatpickr datepicker 工作正常，但反应式不起作用。在 $current_operation_date 下面的代码中 - 组件中的 public var 被修改了，但是在 datepicker 值被选中时，alpine var operation_date 没有改变：

<div>        
    $current_operation_date::{{$current_operation_date}}<BR>
    operation_date::<div x-html="operation_date"></div>
    <!-- The line above is not modified when in datepicker value is selected -->

    <div x-data="{ operation_date: '{{$current_operation_date}}'}">
        <input
            type='text'
            id="flatpickr_operation_date"
            wire:model.lazy="current_operation_date"

            x-model="operation_date"
            x-on:blur="$dispatch('input', operation_date)"
            class="form-control editable_field"
        />
    </div>

</div>


@section('scripts')
    <script>


        $(document).ready(function(){

            var fp = flatpickr(document.querySelector('#flatpickr_operation_date'), {
                enableTime: false,
                dateFormat: 'Y-m-d',
                altFormat: "F j, Y",
                altInput: true,
                inline: …

使用 alpine.js 2，我尝试在应用程序的页脚（为所有布局设置）中定义计时器：

<div>
    
    <div  x-data="appFooterComponent()" x-init=" console.log('initTimer()::'); refreshTime();
    setInterval(refreshTime, 1000) ; console.log('END initTimer::');">
        <div >
            ...
            <span style="background-color: yellow" x-text="refreshTime(@this)"></span>
        </div>
    </div>
</div>

<script>
    // THAT DOES NOT WORK
    // this.refreshTime()
    // setInterval(refreshTime, 1000)

    function appFooterComponent() {
        return {
            refreshTime() {
                return moment(new Date()).format('DD MMMM, YYYY HH:mm:ss')
            },
        }
    } 

</script>

结果，当打开任何新页面时，我会看到当前日期时间是如何设置的，但没有间隔，并且时间不会刷新任何秒。在控制台中，我看到 x-init 控制台命令的输出，但看不到时间间隔...如何修复它？

谢谢！

重新安装我的 Kubuntu 18 后，我尝试运行我的 @vue/cli 4.0.5 / vuex 3 应用程序并得到错误：错误缺少要添加到项目的包列表

serge@AtHome:/mnt/_work_sdb8/wwwroot/lar/VApps/vtasks$ node -v
v14.12.0
serge@AtHome:/mnt/_work_sdb8/wwwroot/lar/VApps/vtasks$ yarn -v
1.22.5
serge@AtHome:/mnt/_work_sdb8/wwwroot/lar/VApps/vtasks$ yarn add
yarn add v1.22.5
error Missing list of packages to add to your project.
info Visit https://yarnpkg.com/en/docs/cli/add for documentation about this command.
serge@AtHome:/mnt/_work_sdb8/wwwroot/lar/VApps/vtasks$ yarn upgrade
yarn upgrade v1.22.5
error No lockfile in this directory. Run `yarn install` to generate one.
info Visit https://yarnpkg.com/en/docs/cli/upgrade for documentation about this command.
serge@AtHome:/mnt/_work_sdb8/wwwroot/lar/VApps/vtasks$ lsb_release -d; uname -r; uname -i
Description:    Ubuntu 18.04.5 LTS
4.15.0-118-generic …

在我的 Laravel 5.8 / "vue": "^2.6.10"/ "vuex": "^3.1.0" app 在 resources/js/components/Login.vue 文件中我有方法

methods: {
    authenticate() {
        this.$store.dispatch('login');    // calling action

        login(this.$data.form)
            .then((res) => {

                this.$store.commit("setLoginSuccess", res);  // calling mutation
                this.$store.dispatch('retrieveHostelBookmarks', res.user.id);
                this.$store.dispatch('retrievePersonalOptions', res.user.id);


                this.$router.push({path: '/personal'}); // For debugging!
            })
            .catch((error) => {
                console.log("=== error::")
                console.log(error)
                this.$store.commit("setLoginFailed", {error});   // calling mutation
            });
    }

在 resources/js/helpers/authFuncs.js 我有定义：

export function login(credentials) {
    return new Promise((res, rej) => {
        axios.post('/api/auth/login', credentials)
            .then((response) => {
                setAuthorizationToken(response.data.access_token);
                res(response.data);
            })
            .catch((err) =>{
                console.error(err)
                rej("Wrong email or password"); …

我想迁移到 vuejs 3 并尝试创建新的 vuejs 3 应用程序，但\n出现找不到 vue 的错误。我愿意 ：

$ npm -version\n6.14.8\n$ nodejs --version\nv14.12.0\n$ cd ../\n$ yarn global add @vue/cli\nyarn global v1.22.5\n[1/4] Resolving packages...\nwarning @vue/cli > @vue/cli-shared-utils > @hapi/joi@15.1.1: joi is leaving the @hapi organization and moving back to 'joi' (https://github.com/sideway/joi/issues/2411)\nwarning @vue/cli > @vue/cli-shared-utils > request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142\nwarning @vue/cli > @vue/cli-shared-utils > @hapi/joi > @hapi/address@2.1.4: This version has been deprecated and is no longer supported or maintained\nwarning @vue/cli > @vue/cli-shared-utils > @hapi/joi > @hapi/hoek@8.5.1: …

阅读https://tailwindcss.com/docs/responsive-design#overview文档我没有看到任何针对超小型设备（如 iPhone 5）的类

那么，如果我需要为 iPhone 5 和 Nexus 7 做不同的设计，有没有办法用 tailwindcss 来制作呢？

谢谢！

在带有 livewire 1.3 的 laravel 7 中，我有一个列表，其中包含分页和惰性图像，通过在加载页面时调用 JS 函数lazyImagesInit（使用了 lazyload 2.0.0-rc.2）来应用于任何项目图像。但是，当我单击分页链接时，我会丢失任何新打开的项目图像的惰性图像效果。查看缓存文件的代码，我发现使用了 gotoPage 方法：

<?php if(is_array($element)): ?>
    <?php $__currentLoopData = $element; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $page => $url): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
        <?php if($page == $paginator->currentPage()): ?>
            <li class="page-item active d-none d-md-block" aria-current="page"><span class="page-link"><?php echo e($page); ?></span></li>
        <?php else: ?>
            <li class="page-item d-none d-md-block"><button type="button" class="page-link" wire:click="gotoPage(<?php echo e($page); ?>)"><?php echo e($page); ?></button></li>
        <?php endif; ?>
    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
<?php endif; ?>

调用 gotoPage 后是否有办法调用我的lazyImagesInit 函数？

谢谢！