vue.js - how to access custom field's data in the dependsOn() of other field in nova - Stack Overflow

admin管理员组

文章数量:1123779

 CustomRepeatInterval::make('Repeat Every','custom_repeat_interval')
->dependsOn('repeat_interval', function (Field $field, NovaRequest $request, FormData $formData) 
{ 
    if ($formData->repeat_interval == 'custom') 
        {
            $field->show();
                    } else {
                        $field->hide();
                    }
                })
                ->onlyOnForms()
                ,

Select::make('Month day', 'custom_months')
    ->options([
        '0' => 'Active',
        '1' => 'Inactive',
    ])
        // ->dependsOn('custom_repeat_interval', function ($field, $request, $formData) 
{
    //  dd($formData,'dsdsd');
    // })

so here i have created one custom field in nova named "CustomRepeatInterval" and also used an select field below that right i want to access the custom fields data in the dependsOn() of the select fieldfor reference i below is my vue js code

<template>
  <DefaultField :field="currentField" :errors="errors">
    <template #field>
      <div class="flex gap-2">
        <div class="w-25">
          <input id="custom_repeat" type="number"
            class="form-control form-input form-control-bordered hide-number-arrows" :class="errorClasses"
            v-model="repeatNum" min="1" />
        </div>
        <div class="w-50">
          <select id="custom_repeat_interval" type="" class="block form-control form-control-bordered form-input"
            placeholder="choose an option" v-model="repeatInterval" >
            <option value="" disabled selected>Choose and option</option>
            <option v-for="option in repeatOptions" :key="option.value" :value="option.value">
              {{ option.label }}
            </option>
          </select>
        </div>

      </div>
    </template>
  </DefaultField>
</template>

<script>
import { DependentFormField, HandlesValidationErrors } from 'laravel-nova'

export default {
  mixins: [DependentFormField, HandlesValidationErrors],

  props: ['resourceName', 'resourceId', 'field'],

  data() {
    return {
      repeatOptions: [
        { value: 'daily', label: 'Daily' },
        { value: 'weekly', label: 'Weekly' },
        { value: 'monthly', label: 'Monthly' },
        { value: 'yearly', label: 'Yearly' },
      ],
      repeatInterval: "daily", // Initialize phone
      repeatNum: "1", // Initialize phone

    };
  },
 
  watch: {
    repeatNum(newValue) {
      if (newValue < 0) {
        this.repeatNum = 1; // Reset the value to 1 if it's below
      }
    }
  },

  methods: {
    /*
     * Set the initial, internal value for the field.
     */
    setInitialValue() {
      this.repeatInterval = this.field.repeatInterval || 'daily'
      this.repeatNum = this.field.repeatNum || '1'
    },

    /**
     * Fill the given FormData object with the field's internal value.
     */
    fill(formData) {
      formData.append("repeatInterval", this.repeatInterval || "");
      formData.append("repeatNum", this.repeatNum || "");
    },


  },
}
</script>

please help me with this problem .....
thanks in advanced

i tried go through the nova document and also searched online about this problem but nothing found fruitful related to this

本文标签： vuejshow to access custom field39s data in the dependsOn() of other field in novaStack Overflow