在vuejs或javascript中访问变量

我有一个javascript变量，我正在使用vuejs

当我试图访问数组字段以验证表单时，chrome开发工具返回一个错误

var checkItems = {contact_email: "", contact_name: "", contact_phone: "", message: "", subject_id: null, …}

我尝试以这种方式访问：

if(checkItems.contact_email)
      alert("email required");

这就是错误：

 Property or method "contact_email" is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option

如果表单字段为空，我希望单独检测哪个字段为空，并为每个字段发送自定义错误，例如： 名称字段为空 电子邮件字段为空

这是我的vuejs代码：

var locale = '{{ $lang }}'; //'es-ES',  

    var V_Alerts = new Vue({

        el : '#v-alerts',

        data : {

            types   : ['danger', 'warning', 'success', 'info'],

            alerts  : [
            ]
        },          

        methods : {

            add : function(type, content, opts)
            {                               
                this.alerts.push({
                    type : type,
                    content : content,
                    opts : opts
                });
            },

            addSuccess : function(content, opts){
                this.add('success',content, opts)
            }
        }
    });

    var new_ticket = new Vue({

        el      : '#create_ticket',

        data    : {
            uploading     : false,
            submitting    : false,
            subject_id    : null,
            message       : '',
            errors: [],
        },

        methods : {

            validation: function (params)
            {
                return {
                    contact_email : IsEmail(params.contact_email),
                    contact_name  : !!params.contact_name.trim(),                   
                    message       : !!params.message.trim(),
                    subject_id    : params.subject_id && !!params.subject_id.trim(),                    
                    captcha       : params.captcha !== 0
                }
            },

            isValid : function(params)
            {
                var validation = this.validation(params);

                return Object.keys(validation).every(function (key) {
                    return validation[key];
                });             
            },        

            restart : function()
            {
                this.uploading  = false;
                this.submitting = false;
                this.subject_id = null;                

                this.$refs.subjects.restart();
                this.$refs.uploads.restart();
                $('#message').text('');
                $('#order_number').val('');  

                $('#contact_email').val('');
                $('#contact_name').val('');
                $('#contact_phone').val('');
                $('#message').val(''); 
                grecaptcha.reset();     
            },            

            onSubjectSelect : function(subject_id){                
                this.subject_id = subject_id;                
            },

            _onSubjectsLoaded : function(subjects){                
                emitOnWidgetContentChanged();
            },


            createTicket : function(e)
            {                
                var params = {
                    contact_email : $('#contact_email').val(),
                    contact_name  : $('#contact_name').val(),
                    contact_phone : $('#contact_phone').val(),
                    message       : $('#message').val(),
                    subject_id    : this.subject_id,
                    message_files : this.$refs.uploads.completed_ids.join(','),
                    captcha       : grecaptcha.getResponse()                    
                };

                @if (Input::has('public_token'))
                    params.public_token = '{{ Input::get('public_token') }}';
                @endif

                if ($('#order_number').val() != '')
                    params.contact_orders = $('#order_number').val();

                if (!this.isValid(params))
                {
                    var checkItems = params;

                    if(checkItems.contact_email)
                        alert("email");

                    alert('{{ addslashes(trans('common.empty_or_error_input')) }}');                    
                    return;
                }                

                this.submitting   = true;
                // only ie11 need this manuall
                params._token = '{!! csrf_token() !!}'; 

                AjaxServices.post('createTicket', params, function(error, result)
                {                   
                    this.submitting = false;

                    if (error)
                    {
                        alert('{{  addslashes(trans('accounts/tickets.error_creating_ticket')) }}');                        
                        grecaptcha.reset();
                    }
                    else
                    {
                        alert('#'+ result.ticket_id +' - {{  addslashes(trans('accounts/tickets.new_ticket_created_ok')) }} :)');
                        V_Alerts.addSuccess('#'+ result.ticket_id +' - {{  addslashes(trans('accounts/tickets.new_ticket_created_ok')) }}');                        
                        this.restart();                        
                        emitOnWidgetContentChanged();

                    }
                }.bind(this));                
            },

            onUploadComplete : function(ids){
                this.uploading = false;      
                emitOnWidgetContentChanged();
            },

            onUploadStarted : function(){
                this.uploading = true;
                setTimeout(emitOnWidgetContentChanged,1);
            },

            onItemDeleted : function(){

            },

            onFilesSelected : function(){               
            }                 
        }
    });

      function IsEmail(email) {
    var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/;
    return regex.test(email);
  }     

    $(document).ready(function(){
        //new_ticket.restart();
    });

---

您没有正确使用Vue。您收到的错误源于未在数据对象中定义属性。您不能像在

验证
方法中那样返回它们，因为Vue正在查找名为
contact\u email
的数据对象，或名为
contact\u email（）
的方法，甚至是名为
contact\u email
的计算属性

  data    : {
          // define your properties here
          contact_email: '';
    },
  methods: {
     yourMethod: function(){
         //modify your properties here
         this.contact_email: IsEmail(params.contact_email)
       }
  }

请插入更多完整代码对于此问题，vue代码的外观很重要like@AliaksandrPitkevich我编辑主目录post@Imre_G我编辑了主要假设jQuery和Vue在我看来没有抓住要点。扔掉jQuery，完全跳上Vue船。你不会失望的。您可以使用v-model和v-bind来完成所有这些$.val（）的工作。